のWebPACK-devのサーバー

Question

私はangularjsアプリのためのWebPACK-devのサーバーを使用しています、私はこのようなpackage.jsonでタスクからそれを起動します。

"scripts": { 
    "start-api": "node api/server.js", 
    "dev": "webpack-dev-server --env dev --history-api-fallback --inline --progress --port 5000", 
    "start": "npm run dev" 
    }, 

私は、バックエンドのAPIサーバーを持っていますそれは、KOAを使用し、同じポート上で実行されている：KOAサーバーが開始されると

const koa = require('koa'); 

app.listen(5000); 

module.exports.app; 

、それはすべての要求をインターセプトし、私は角ブラウザアプリをブラウズすることはできません。

私はkoaからすべてを提供しなければならないのでしょうか、あるいは2人を一緒に働かせる方法がありますか？

Answer 1

はい、独自のバックエンドAPIでwebpack-dev-serverを使用できます。これを行うには2通りの方法があります：

最初に、proxyを使用するようにdev-serverを設定できます。これは私が使用するソリューションであり、それは私のためにうまくいきます。むしろ、DEV-サーバーよりも、この設定は、「/ API」で始まるすべての要求は（この場合は8080ローカルホスト上で実行されている）、バックエンドのAPIサーバに送信されることが保証されます

proxy: { 
    "/api/*": { 
    target: "http://localhost:8080" 
    } 
} 

：私の構成は次のようになります。必要に応じて必要であれば、あなたはそのような機能を持つプロキシをバイパスすることができます

proxy: { 
    "/api/*": { 
    target: "http://localhost:8080", 
    bypass(req, res) { 
     return (/* some condition */) ? '/index.html' : false; 
    } 
    } 
} 

しかし、「/ API/*」キーは私が保証するために必要なすべてですので、私は、これを使用するために必要なことはありません各要求は適切なサーバーに送信されます。

重要なことに、2つのサーバーを異なるポートで実行する必要があります。私は通常バックエンドに8080、dev-serverに9090を使用します。