排查 webpack 开发服务器 cli 错误答案

【问题标题】：Troubleshooting webpack dev server cli errors排查 webpack 开发服务器 cli 错误
【发布时间】：2022-01-01 08:33:33
【问题描述】：

在成功构建的 webpack 包上运行“npx webpack 服务器”，发生错误时的输出并不能告诉我太多（错误：webpack 开发服务器代码深处的“错误标签”），你在哪里看更多信息/细节？这是输出：

npx webpack 服务

(node:31820) [DEP_WEBPACK_DEV_SERVER_HTTPS] DeprecationWarning: 'https' option is deprecated. Please use the 'server' option.
(Use `node --trace-deprecation ...` to show where the warning was created)
<i> [webpack-dev-server] SSL certificate: C:\Code\pl-security-audit-hub\PrecisionLender.SecurityAuditHub.API\ClientApp\node_modules\.cache\webpack-dev-server\server.pem
<w> [webpack-dev-server] "hot: true" automatically applies HMR plugin, you don't have to add it manually to your webpack configuration.
<i> [webpack-dev-server] [HPM] Proxy created: **  -> https://localhost:5510
[webpack-cli] Error: wrong tag
    at Object.createSecureContext (_tls_common.js:271:19)
    at Server.setSecureContext (_tls_wrap.js:1331:27)
    at Server (_tls_wrap.js:1186:8)
    at new Server (https.js:70:3)
    at Object.createServer (https.js:106:10)
    at Server.createServer (C:\Code\pl-security-audit-hub\PrecisionLender.SecurityAuditHub.API\ClientApp\node_modules\webpack-dev-server\lib\Server.js:1606:53)
    at Server.initialize (C:\Code\pl-security-audit-hub\PrecisionLender.SecurityAuditHub.API\ClientApp\node_modules\webpack-dev-server\lib\Server.js:1165:10)
    at Server.start (C:\Code\pl-security-audit-hub\PrecisionLender.SecurityAuditHub.API\ClientApp\node_modules\webpack-dev-server\lib\Server.js:2177:16)
    at async Command.<anonymous> (C:\Code\pl-security-audit-hub\PrecisionLender.SecurityAuditHub.API\ClientApp\node_modules\@webpack-cli\serve\lib\index.js:242:25)
    at async Promise.all (index 1)

【问题讨论】：

标签： webpack webpack-dev-server

【解决方案1】：

见https://webpack.js.org/configuration/dev-server/#devserverhttps。此选项已弃用，取而代之的是 devServer.server 选项。

从以下位置更改您的本地 webpack 配置：

devServer: {
  ...,
  https: {
    cert: ...,
    key: ...,
  },
},

进入：

devServer {
  ...,
  server: {
    type: 'https',
    options: {
      cert: ...,
      key: ...,
    },
  },
},

【讨论】：