我正在为一个使用Babel、Webpack、Eslint和React的项目升级包。在进行包更新时，我在重建应用程序时遇到错误，我很想看看我的配置中可能缺少什么，从而生成以下错误：

ERROR in Failed to load config "@ljharb" to extend from.
Referenced from: C:\projects\project\node_modules\qs\.eslintrc

本项目最初使用eslint-loader，但由于该软件包已弃用，而改用eslint-webpack-plugin，并且由于我从Webpack 4升级到Webpack 5，因此我查阅了他们的文档以更新config.js，以反映一些新方法。我相信我配置的选项与使用eslint-loader的原始实现类似。但我也不相信这是我的问题的原因。我确实看到的是，我的node_modules似乎被linted了。我也知道有很多类似的问题与此错误，但大多数都是围绕monorepo或嵌套的node_modules，我没有，这些解决办法不适用于这个问题。

• • 我已经采取的步骤**我已经为airbnb进行了对等依赖升级/安装，我相信这是这个错误的来源。我已经删除了我的node_modules，*-lock. json文件，干净安装，并重新启动了VSCode，这个错误仍然存在。

以下是我的配置：

• • 包. json**

{
  "name": "someProject",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "local": "webpack serve --env development",
    "build": "webpack --env production",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "dependencies": {
    "antd": "^4.18.2",
    "aws-amplify": "^4.3.11",
    "axios": "^0.24.0",
    "bootstrap": "^5.1.3",
    "connect-history-api-fallback": "^1.6.0",
    "dotenv": "^10.0.0",
    "express": "^4.17.2",
    "formik": "^2.2.9",
    "formik-antd": "^2.0.3",
    "history": "^5.2.0",
    "moment": "^2.29.1",
    "react": "^17.0.2",
    "react-bootstrap": "^2.1.0",
    "react-cookie": "^4.1.1",
    "react-dom": "^17.0.2",
    "react-redux": "^7.2.6",
    "react-router": "^5.2.0",
    "react-router-dom": "^5.2.0",
    "reactstrap": "^9.0.1",
    "redux": "^4.1.2",
    "url-loader": "^4.1.1",
    "yup": "^0.32.11"
  },
  "devDependencies": {
    "@babel/core": "^7.16.7",
    "@babel/eslint-parser": "^7.16.5",
    "@babel/plugin-transform-runtime": "^7.16.7",
    "@babel/preset-env": "^7.16.7",
    "@babel/preset-react": "^7.16.7",
    "@babel/runtime": "^7.16.7",
    "autoprefixer": "^10.4.1",
    "babel-loader": "^8.2.3",
    "babel-node": "0.0.1-security",
    "clean-webpack-plugin": "^4.0.0",
    "copy-webpack-plugin": "^10.2.0",
    "css-loader": "^6.5.1",
    "eslint": "^8.2.0",
    "eslint-config-airbnb": "^19.0.4",
    "eslint-config-prettier": "^8.3.0",
    "eslint-plugin-import": "^2.25.3",
    "eslint-plugin-jsx-a11y": "^6.5.1",
    "eslint-plugin-prettier": "^4.0.0",
    "eslint-plugin-react": "^7.28.0",
    "eslint-plugin-react-hooks": "^4.3.0",
    "eslint-webpack-plugin": "^3.1.1",
    "file-loader": "^6.2.0",
    "html-loader": "^3.0.1",
    "html-webpack-plugin": "^5.5.0",
    "node-sass": "^7.0.1",
    "nodemon": "^2.0.15",
    "postcss-loader": "^6.2.1",
    "precss": "^4.0.0",
    "prettier": "^2.5.1",
    "sass-loader": "^12.4.0",
    "style-loader": "^3.3.1",
    "terser-webpack-plugin": "^5.3.0",
    "transform-runtime": "0.0.0",
    "webpack": "^5.65.0",
    "webpack-cli": "^4.9.1",
    "webpack-dev-server": "^4.7.2"
  },
  "peerDependencies": {
    "postcss": "^8.0.0"
  },
  "author": "",
  "license": "ISC",
}

• .爱沙尼亚贸易中心*

{
    "root": true,
    "parser": "@babel/eslint-parser",
    "parserOptions": {
        "ecmaVersion": 2020,
        "sourceType": "module",
        "ecmaFeatures": {
            "jsx": true
        }
    },
    "settings": {
        "react": {
            "version": "detect"
        },
        "import/resolver": {
            "node": {
                "extensions": [".js", ".jsx", ".json"]
            }
        }
    },
    "extends": [
        "airbnb",
        "prettier"
    ],
    "plugins": ["react", "react-hooks", "import", "jsx-a11y", "prettier"],
    "env": {
      "es6": true,
      "node": true
    },
    "rules": {
        "jsx-quotes": [
            2,
            "prefer-single"
        ],
        "comma-dangle": 0,
        "curly": [
            2,
            "all"
        ],
        "arrow-body-style": [
            2,
            "always"
        ],
        "camelcase": 0,
        "class-methods-use-this": 0,
        "consistent-return": 0,
        "import/no-extraneous-dependencies": 0,
        "import/no-useless-path-segments": 0,
        "jsx-a11y/label-has-associated-control": 0,
        "jsx-a11y/label-has-for": 0,
        "jsx-a11y/no-noninteractive-element-to-interactive-role": 0,
        "jsx-curly-spacing": 0,
        "import/no-named-as-default": 0,
        "import/no-named-as-default-member": 0,
        "no-case-declarations": 0,
        "no-console": 0,
        "no-continue": 0,
        "no-debugger": 0,
        "no-lonely-if": 0,
        "no-nested-ternary": 0,
        "no-param-reassign": 0,
        "no-plusplus": 0,
        "no-restricted-globals": 0,
        "no-trailing-spaces": 0,
        "no-underscore-dangle": 0,
        "no-unused-expressions": 0,
        "no-unused-vars": 0,
        "no-use-before-define": 0,
        "operator-linebreak": 0,
        "prefer-destructuring": 0,
        "react/destructuring-assignment": 0,
        "react/jsx-boolean-value": 0,
        "react/jsx-curly-spacing": 0,
        "react/jsx-filename-extension": 0,
        "react/jsx-no-bind": 0,
        "react/jsx-no-target-blank": 0,
        "react/jsx-one-expression-per-line": 0,
        "react/no-unused-state": 0,
        "react/prefer-stateless-function": 0,
        "react/prop-types": 0,
        "react/react-in-jsx-scope": 0,
        "react/sort-comp": 0,
        "react/no-access-state-in-setstate": 0,
        "template-curly-spacing": 0,
        "no-will-update-set-state": 0,
        "linebreak-style": [0, "error", "windows"]
    },
    "globals": {
        "document": false
    }
}

• .西班牙语*

**/node_modules/*
deploy/*
build/*
.ebextensions
.prettier*
**/test/**

• .巴伯尔中心*

{
  "plugins": [
    [
      "@babel/plugin-transform-runtime",
      {
        "regenerator": true
      }
    ]
  ],
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react"
  ]
}

• • 网络包配置js**

const dotenv = require('dotenv');
const HtmlWebPackPlugin = require("html-webpack-plugin");
const path = require('path');
const webpack = require("webpack");
const ESLintPlugin = require('eslint-webpack-plugin');
const preCSS = require('precss');
const autoPrefixer = require('autoprefixer');

const APP_DIR = path.resolve(__dirname, "./src");

dotenv.config();

const ESLINT_PLUGIN_OPTIONS = {
  extensions: ['js', 'jsx'],
  exclude: [
    '/node_modules/'
  ],
  fix: false,
  emitError: true,
  emitWarning: true,
  failOnError: true
};

module.exports = {
  devServer: {
    static: APP_DIR, // boolean | string | array, static file location
    historyApiFallback: true,
  },
  entry: './src/index.js',
  mode: 'development',
  output: {
    path: path.resolve(__dirname, 'build'),
    publicPath: '/',
    filename: 'main.js',
  },
  devtool: 'source-map',
  module: {
    rules: [
      {
        test: /\.(js)$/,
        exclude: /node_modules/,
        use: ['babel-loader'],
      },
      {
        test: /\.html$/,
        use: [
          {
            loader: "html-loader"
          }
        ]
      },
      {
        test: /\.(css|scss)$/,
        use: [{
          loader: 'style-loader', // inject CSS to page
        }, {
          loader: 'css-loader', // translates CSS into CommonJS modules
        }, {
          loader: 'postcss-loader', // Run post css actions
          options: {
            postcssOptions: {
              plugins:
                // post css plugins, can be exported to postcss.config.js
                [
                  preCSS,
                  autoPrefixer
                ]
            }
          }
        }, {
          loader: 'sass-loader' // compiles Sass to CSS
        }]
      },
      {
        test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/, /\.svg$/, /\.ttf$/, /\.pdf$/],
        loader: 'url-loader',
        options: {
          limit: 100000,
          name: 'static/media/[name].[hash:8].[ext]'
        }
      },
    ],
  },
  plugins: [
    new ESLintPlugin(ESLINT_PLUGIN_OPTIONS),
    new HtmlWebPackPlugin({
      template: path.resolve("./src/index.html"),
      filename: "./index.html"
    }),
    autoPrefixer,
  ],
  resolve: {
    alias: {
      Assets: path.resolve(__dirname, 'src/assets/'),
      Services: path.resolve(__dirname, 'src/services/'),
      Styles: path.resolve(__dirname, 'src/styles/'),
      Utilities: path.resolve(__dirname, 'src/utilities/'),
      CommonComponents: path.resolve(__dirname, 'src/components/common/')
    }
  }
};

我知道这个问题存在于webpack.config.js中，因为其中的更改直接影响我看到的消息，并且在其他正在修改的文件（eslintrc.json）中没有发生可见的影响。

• • 编辑：**

(In webpack.config.js）当我注解掉eslint-webpack-plugin和相关代码时，会生成捆绑包，因此错误是100%围绕从eslint-loader到eslint-webpack-plugin的移动。