webpack-dev-server 请问怎么参数配置 https

使用 webpack-dev-server 参数配置 https 的时候,官方文档如下

var server = new WebpackDevServer(compiler, {
  ...
  https: {
    cert: fs.readFileSync("path-to-cert-file.pem"),
    key: fs.readFileSync("path-to-key-file.pem"),
    cacert: fs.readFileSync("path-to-cacert-file.pem")
  }
});

请问怎么配置 其中参数呢?能不能使用 --https 的默认配置

阅读 12.4k
3 个回答
新手上路,请多包涵

开发环境尽量不要用这个参数,否则改回到HTTP时,你会发现他默认给链接都配置了HTTPS协议,今天一天各种折腾,最后回滚代码才恢复正常。HTTPS还是交给nginx之类的反向代理来实现吧,代码层面就不折腾了吧。欢迎补充。

// 如果只是想在开发环境启用 https 的话,这么写就可以
var server = new WebpackDevServer(compiler, {
  devServer: {
    https: true,
    port: 8080,
  },
});




// 如果想要在部署时使用 https 方式部署,一个暂时可用的方法,按下面的方式配置,然后 npm run dev 
var server = new WebpackDevServer(compiler, {
  devServer: {
    https: true,
    port: 8080,
    host: getIPAdress(),
  },
});

// 这个函数可以自动获取本机的 ip
function getIPAdress() {
  var interfaces = require('os').networkInterfaces();
  for (var devName in interfaces) {
    var iface = interfaces[devName];
    for (var i = 0; i < iface.length; i++) {
      var alias = iface[i];
      if (alias.family === 'IPv4' && alias.address !== '127.0.0.1' && !alias.internal) {
        return alias.address;
      }
    }
  }
}

如果想要通过 nginx 来部署,并且使用 https 协议, 可以看大佬的文章(我自己没验证)

宣传栏