如何运行Webpack Dev Server --https --hot --inline

Question

在使用CLI配置时，有没有一种方法可以利用webpack-dev-server在https上运行？

问题是与socket.io的连接是通过http而不是https进行的。

---

有一个解决方法，但非常麻烦。

1. 在您的index.html中手动包含https webpack-dev-server

<script src="https://localhost:8080/webpack-dev-server.js"></script>

2. 配置每个端点以包括webpack/hot/only-dev-server。

（Translated text）

app: [
    'webpack/hot/only-dev-server',
    './app.js'
],

// ... more entry points that include the same [] ...

- chemoish

Answer 1

有一种方法可以使用CLI配置webpack-dev-server以在https上进行配置。

解决方案是不使用--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包含进入entry中。

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的主要配置。

- chemoish

Answer 2

我认为您可以在入口点添加此行代码，以创建安全套接字连接：

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

- RIdotCOM

Answer 3

我在package.json中使用了这样的配置，然后就可以使用我需要的端口进行工作了：

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

- Gurudath BN