忽略或防止 ESLint 錯誤破壞 React webpack 項目中的構建

Question

問題是，在我開發時，每次 ESLint 出現問題時，構建都會中斷並且無法編譯代碼。

我設置了 emitWarning: true，但不起作用。 我的 React 項目是使用 webpack、neutrino JS、esLint、airbnb 開發的。

運行構建時出現錯誤

錯誤 in./src/index.jsx 模塊構建失敗（來自./node_modules/eslint-loader/dist/cjs.js）：由於 eslint 錯誤，模塊失敗。

.neutrinorc.js 文件中的代碼結構

const path = require("path");
const airbnb = require("@neutrinojs/airbnb");
const react = require("@neutrinojs/react");

module.exports = {
  options: {
    root: __dirname,
  },
  use: [
    (neutrino) => {
      neutrino.config.resolve.modules
        .add("node_modules")
        .add(path.resolve(__dirname, "src"));

      neutrino.config.resolve.extensions.add(".jsx");

      neutrino.config.resolve.alias.set("react-dom", "@hot-loader/react-dom");
    },
    airbnb({
      eslint: {
        emitWarning: true,
        baseConfig: {
          settings: {
            "import/resolver": "webpack",
          },
          rules: {
            radix: "off",
            "comma-dangle": "off",
            "react/no-danger": "off",
            "react/button-has-type": "off",
            "react/no-find-dom-node": "off",
            "react/jsx-filename-extension": "off",
            "no-console": [
              "error",
              {
                allow: ["warn", "error"],
              },
            ],
            "no-alert": "off",
            "no-plusplus": "off",
            "no-else-return": "off",
            "no-nested-ternary": "off",
            "no-underscore-dangle": "off",
            "no-restricted-syntax": "off",
            "max-len": 0,
            "quote-props": "off",
            "default-case": "off",
            "class-methods-use-this": "off",
            "import/prefer-default-export": "off",
            "react/no-array-index-key": "off",
            "jsx-a11y/click-events-have-key-events": "off",
            "jsx-a11y/label-has-for": [
              "error",
              {
                required: {
                  some: ["nesting", "id"],
                },
              },
            ],
          },
        },
      },
    }),

Answer 1

您需要將failOnWarning添加為false

emitWarning: true,
failOnWarning: false,

Answer 2

我不得不結合幾個解決方案來解決這個問題。 它不是最優雅的，但它確實有效。

將 RUN_ESLINT=true 添加到 package.json 觀察腳本：

export RUN_ESLINT=true && webpack --config webpack.config.js --watch --mode development

將 module.exports 重寫為 function：

module.exports = () => {
...
return {}
}

使用webpack.EnvironmentPlugin拉入環境變量。

new webpack.EnvironmentPlugin(["NODE_ENV", "DEBUG", "RUN_ESLINT"]);

有條件地添加 ESLintPlugin：

const plugins = [...];

if (process.env.RUN_ESLINT) {
  plugins.push(new ESLintPlugin());
}
  

這使我可以繼續使用我的npm run build和npm run watch腳本，就像我在添加 eslint 之前一樣。