web-dev-qa-db-ja.com

Webpack DevServerの実行方法--https--hot --inline

CLIを使用して構成するときに、httpsでwebpack-dev-serverを実行することを活用する方法はありますか？

問題は、socket.ioへの接続がhttpを超えており、httpsを超えていないことです。

回避策はありますが、非常に面倒です。

  1. 手動でhttpswebpack-dev-serverをindex.htmlに含めます
<script src="https://localhost:8080/webpack-dev-server.js"></script>
  1. webpack/hot/only-dev-serverを含めるように各エンドポイントを構成します。
app: [
    'webpack/hot/only-dev-server',
    './app.js'
],

// ... more entry points that include the same [] ...
webpackwebpack-dev-server
8
chemoish

はい、CLIを使用して構成する場合、httpsでwebpack-dev-serverを構成する方法があります。

解決策は、--inlineオプションを使用しないことです。

サーバーと--hotを構成する方法はたくさんあります。カスタムサーバー実装/ミドルウェア（同じかもしれない）を作成していないと仮定した場合の次の手順は、ドキュメントで詳しく説明されています。

http://webpack.github.io/docs/webpack-dev-server.html#webpack-dev-server-cli

  • 含めないでください<script src="https://localhost:8080/webpack-dev-server.js"></script>
  • エントリにwebpack/hot/only-dev-serverを含めないでください。

package.json

{
  "scripts": {
    "start": "webpack-dev-server -d --hot --https --config webpack.config.development.js"
  }
}

webpack.config.development.js

var webpackConfig = require('webpack-config');

module.exports = webpackConfig.fromCwd().merge({
    devServer: {
        colors:             true,
        contentBase:        './build',
        historyApiFallback: true,
        inline:             true,
        progress:           true
    },

    devtool: 'eval-source-map'
});

メインのwebpack構成はここにリストされていません。

14
chemoish

この行をエントリポイントに追加して、安全なソケット接続も作成できると思います。

"dev-server": "webpack-dev-server/client?https://localhost:8080/",
1
RIdotCOM

私はpackage.jsonでこのように使用し、必要なポートで作業を開始しました。

"scripts": {
  "serve": "webpack-dev-server --inline --colors --watch --display-error-details --display-cached  --port 3001 --hot"
},
0
Gurudath BN