错误：找不到模块 'html-webpack-plugin' - Webpack (React)

Question

我尝试按照此链接使用 webpack 4 创建一个基本的 React 应用程序

在安装“html-webpack-plugin”之前，我没有遇到任何错误。 但是，一旦我运行命令“npm run start”，我就会不断收到以下错误：

**Error: Cannot find module 'html-webpack-plugin'
    at Function.Module._resolveFilename (module.js:547:15)
    at Function.Module._load (module.js:474:25)
    at Module.require (module.js:596:17)**

我尝试通过在全局和本地安装软件包来使用以下两个线程解决此问题，但没有帮助。

错误：找不到模块 html-webpack-plugin

https://github.com/webpack/webpack-dev-server/issues/1330

请看我下面的代码：

包.json：

{
  "name": "react_website",
  "version": "1.0.0",
  "description": "Website using React and Webpack",
  "main": "index.js",
  "scripts": {
    "start": "webpack --mode development",
    "build": "webpack --mode production"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "babel-preset-env": "^1.7.0",
    "babel-preset-react": "^6.24.1",
    "html-webpack-plugin": "^3.2.0",
    "webpack": "^4.16.2",
    "webpack-cli": "^2.1.5"
  },
  "dependencies": {
    "react": "^16.4.1",
    "react-dom": "^16.4.1"
  }
}

webpack.config.js：

const HtmlWebPackPlugin = require("html-webpack-plugin");

module.exports = {
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader"
        }
      }
    ]
  },
  plugins: [
    new HtmlWebPackPlugin({
    template: "./src/index.html",
    filename: "./index.html"
  })
],
};

- .babelrc：

{
  "presets": ["env", "react"]
}

Answer 1

使用这个命令：

npm i --save-dev html-webpack-plugin

Answer 2

尝试删除节点模块： rm -rf node_modules 。

接下来重新安装所有开发依赖项npm install 。

最后，重新安装html-webpack-plugin npm i html-webpack-plugin --save-dev 。

我还建议确保所有目录路径都是正确的，并且您位于实际的项目文件夹中。 这种情况很少见，但可能会不时发生。

Answer 3

就我而言，使用打字稿，sublime 没有找到它。 甚至不需要安装@types/html-webpack-plugin ，它已经存在。 只需要重新启动 IDE 即可注册。

Answer 4

您还可以使用以下命令解决错误。

npm install html-webpack-plugin