webpack-dev-serverからASP.NETの開発サーバーにアクセスする
webpack-dev-serverからASP.NETの開発サーバーにアクセスする方法を紹介します。
クライアントの開発サーバー(webpack-dev-server)はHot Module Replacement(hmr)が有効になっているため、開発時はクライアントの開発サーバーをメインで使用したいことが多いです。
クライアントの開発サーバーからASP.NETの開発サーバーにアクセスするには以下のようにwebpack-dev-serverの設定でproxyを設定します。
URLはASP.NETで起動する開発サーバーのURLを設定します。
これにより、すべてのリクエストはASP.NETの開発サーバーを見に行くようになります。
webpack.config.jsdevServer: {
proxy: {
'/': {
target: 'https://localhost:5001',
},
},
},vue-cliの場合
vue-cliを使用している場合はvue.config.jsに以下を追記します。(vue.config.jsのファイルがない場合は作成してください)
vue.config.jsmodule.exports = {
devServer: {
proxy: {
'/': {
target: 'https://localhost:5001',
},
},
},
};