eslint 'html-webpack-plugin' 应该列在项目的依赖项中，而不是 devDependencies 中。 （导入/无外部依赖项）

Posted 2023-03-07

【中文标题】eslint \'html-webpack-plugin\' 应该列在项目的依赖项中，而不是 devDependencies 中。 （导入/无外部依赖项）

【英文标题】：eslint 'html-webpack-plugin' should be listed in the project's dependencies, not devDependencies. (import/no-extraneous-dependencies)eslint 'html-webpack-plugin' 应该列在项目的依赖项中，而不是 devDependencies 中。 （导入/无外部依赖项）

【发布时间】：2018-10-29 12:08:14

【问题描述】：

在我的 Vs 代码编辑器中，我在简单的 require 语句中出现以下错误，例如：

const htmlWebpackPlugin = require('html-webpack-plugin')

错误：[eslint] 'html-webpack-plugin' 应该列在项目的依赖项中，而不是 devDependencies。 （导入/无外部依赖项）

谁能在我的 webpack 配置中用简单的 require 语句解释什么是无外部依赖关系以及为什么它给我这个错误。我浏览了这个链接：eslint should be listed in the project's dependencies, not devDependencies 但这并没有太大帮助，因为它没有解释我为什么要添加该行。

我的 eslintrc.json 文件：

  "env": 
    "browser": true,
    "es6": true,
    "commonjs": true,
    "node": true
  ,
  "extends": ["airbnb", "prettier", "prettier/react"],
  "plugins": ["prettier"],
  "parserOptions": 
    "ecmaVersion": 6,
    "sourceType": "module",
    "ecmaFeatures": 
      "jsx": true
    
  

【参考方案1】：

你只需要告诉 eslint 在 webpack 中需要 dev 依赖就可以了。

你可以在你的 webpack 文件夹中创建.eslintrc

rules:
  import/no-extraneous-dependencies: [error,  devDependencies: true ]

这将防止错误出现。

或者你也可以设置

const HtmlWebpackPlugin = require('html-webpack-plugin'); // eslint-disable-line import/no-extraneous-dependencies

只禁用这一行