Question

为了使用我想要集成到我的应用程序中的模块（我在本地开发），我必须做两件事：
1）使我的应用程序在HTTPS上本地运行 2）使用特定域运行应用程序。

使用我用于本地开发的Webpack开发服务器，这两件事情都应该非常简单，但由于某种原因，它不能像文档建议那样工作。

我的webpack.config文件是：

module.exports = {
  entry: './app/js/app.js',
  output: {
    path:'./app/js/',
    publicPath: 'https://specialurl.com/assets',
    filename:'bundle.js'
 }

我指向的路径已添加到计算机上的hosts文件中，因此它应该与localhost默认值一样有效。

我的package.json文件有这个作为开发服务器的启动脚本：

"scripts": {
"start": "webpack-dev-server --progress --colors --https",
}

我做了这些更改，然后在保存后我以npm start重新启动。问题是服务器仍然没有在https上运行，当我将浏览器指向新链接时，它只显示任何内容。我发现的所有文档看起来都应该有效，所以我必须遗漏一些明显的东西。

Answer 1

解决了！事实证明，按照我的预期，使用Webpack非常容易，但文档有点令人困惑。

您只需编辑主机文件以包含所需的域，然后将以下代码添加到webpack.config：

 devServer: {
  host: "localhost.specialurl.com",
  port: 1234,
  https: true
},

运行npm start并将浏览器指向https://localhost.specialurl.com:1234/webpack-dev-server，您应该全部设置：）

Answer 2

要通过热模块重载实现此目的，请将public的值设置为undefined，然后它将使用host中的值。

environment.config.devServer.public = undefined
environment.config.devServer.host = 'localhost.example.com'
environment.config.devServer.https = {
  https: true,
  hot: true,
  key: fs.readFileSync(path.resolve('ssl/localhost.example.com.key.pem')),
  cert: fs.readFileSync(path.resolve('ssl/localhost.example.com.cert.pem')),
}

这是因为以下行，如果定义了public，它将忽略指定的主机： https://github.com/webpack/webpack-dev-server/blob/master/lib/utils/createDomain.js#L16

设置webpack以通过HTTPS在自定义域上本地运行

2 个答案: