React项目执行npm run build时报html-webpack-plugin入口点index.html错误

你所贴的两段日志本身是webpack子编译的正常输出，不属于报错信息。如果构建无法完成，说明你漏看了日志中更早位置的实际报错内容，或是构建过程卡在了子编译环节，可按以下步骤排查解决：

• 第一步：核对html-webpack-plugin配置
  打开internals/webpack/webpack.prod.babel配置文件，找到HtmlWebpackPlugin的实例化代码，确认template参数的路径指向正确：因为你的index.html存放在项目根目录，而配置文件在internals/webpack/下，所以需要用相对路径定位到根目录的index.html，示例配置如下：

const path = require('path')
// 插件配置段
new HtmlWebpackPlugin({
  // 从配置文件所在目录向上走两层，到达项目根目录定位index.html
  template: path.resolve(__dirname, '../../index.html'),
  filename: 'index.html',
  inject: 'body'
})

• 第二步：排查PWA插件兼容问题
  日志中的__offline_serviceworker说明项目配置了离线缓存相关的PWA插件，若你不需要PWA能力，直接在webpack配置中删除offline-plugin、workbox-webpack-plugin等PWA相关插件的配置即可，可直接消除该类子编译环节的兼容问题。

• 第三步：匹配依赖版本
  html-webpack-plugin和webpack存在严格的版本对应关系，你当前使用的3.0.7版本仅适配webpack 3.x：

  • 若你当前webpack版本为4.x，需执行npm i html-webpack-plugin@4 -D安装对应版本
  • 若你当前webpack版本为5.x，需执行npm i html-webpack-plugin@5 -D安装对应版本

• 第四步：清理缓存重新构建
  删除项目根目录下的node_modules文件夹、package-lock.json文件，再依次执行npm install、npm run build即可。

内容的提问来源于stack exchange，提问作者Sim Tim