Question

create-react-app v3.0.0 is out。它在内部支持TypeScript棉绒。（太好了！）我想我了解TSLint处于打开状态的情况，并计划用ESLint替换它，但现在还不是。

如何在react-scripts start中禁用掉毛步骤？

/* eslint-disable */和其他不是我想要的。

Answer 1

从 react-scripts v4.0.2 开始，您现在可以通过环境变量选择退出 ESLint。您可以通过将其添加到 .env 文件或在 package.json 文件中为脚本添加前缀来实现。

例如在 .env 中：

DISABLE_ESLINT_PLUGIN=true

或者在你的 package.json 中：

{
  "scripts": {
    "start": "DISABLE_ESLINT_PLUGIN=true react-scripts start",
    "build": "DISABLE_ESLINT_PLUGIN=true react-scripts build",
    "test": "DISABLE_ESLINT_PLUGIN=true react-scripts test"
  }
}

https://github.com/facebook/create-react-app/pull/10170

Answer 2

步骤1

在项目根目录中创建.env文件，如果该文件不存在，并在其中添加此行

EXTEND_ESLINT=true

步骤2

将.eslintrc.js添加到具有以下内容的项目根目录

module.exports = {
  "extends": ["react-app"],
  "rules": {
  },
  "overrides": [
    {
      "files": ["**/*.js?(x)"],
      "rules": {
// ******** add ignore rules here *********
        "react/no-unescaped-entities": "off",
        "react/display-name": "off",
        "react/prop-types": "off",
      }
    }
  ]
}

请注意override > rules部分：添加带有“ off”标志的规则以将其禁用。

Answer 3

首先确保将EXTEND_ESLINT环境变量设置为true。可以在.env文件中进行设置。

对于打字稿，应在覆盖数组中添加更多规则，如下例所示：

{
  "eslintConfig": {
    "extends": ["react-app"],
    "overrides": [
      {
        "files": ["**/*.ts?(x)"],
        "rules": {
          "eqeqeq": "warn"
        }
      }
    ]
  }
}

Answer 4

我的解决方法没有弹出：

像这样在 .eslintrc.js 中使用环境变量：

module.exports = {
    "extends": process.env.REACT_APP_DEV_DISABLE_ESLINT ? [] : [
      "eslint:recommended",
      "plugin:import/errors",
      "plugin:import/warnings",
      "plugin:json/recommended",
      "plugin:@typescript-eslint/recommended",
      "plugin:jsx-a11y/recommended",
      "plugin:react/recommended",
    ],
    "rules": process.env.REACT_APP_DEV_DISABLE_ESLINT ? {} : {
      // ...rules for production CI
    }
}

在 package.json 中的启动脚本中设置变量：

{
      "scripts": {
          "eslint:disable": "REACT_APP_DEV_DISABLE_ESLINT=true",
          "start": "npm run eslint:disable  react-scripts start"
      }
}

Answer 5

您可以使用eslint禁用Craco（并覆盖其他配置）。

需要进行4次更改：

npm install @craco/craco --save
创建craco.config.js（与package.json在同一文件夹中）
使用以下内容填充craco.config.js：

module.exports = {
  eslint: {
    enable: false,
  },
};

最后，在react-script脚本中将craco替换为package.json，即

"scripts": {
  "build": "craco build",
  "start": "craco start",
}

这将禁用ESLint。有关如何扩展ESLint配置的示例，请参见Craco documentation。

Answer 6

您可以将EXTEND_ESLINT环境变量设置为true，例如在.env文件中：

EXTEND_ESLINT=true

现在，您可以在package.json文件中扩展eslint配置：

...
"eslintConfig": {
    "extends": "react-app",
    "rules": {
      "jsx-a11y/anchor-is-valid": "off"
    }
  },
...

要禁用eslint，您可以添加文件.eslintignore，其内容如下：

有关详细信息，请参见文档：https://create-react-app.dev/docs/setting-up-your-editor/#experimental-extending-the-eslint-config

Answer 7

唯一的方法是通过运行eject / react-scripts-yarn eject npm run eject并手动关闭eslint配置文件中的webpack

请查看以下分支：create-react-app closer look，尤其是在eject-tic_tac_toe所在的scripts/start.js目录中-在yarn start / {{之后出现魔术的脚本1}}-和npm start-您在config/webpack.config.dev.js中使用webpack的配置的位置。这是您可能感兴趣的部分：

start.js

Answer 8

我的解决方法：

添加一个 .eslintignore 文件：

并使用 --no-ignore 运行 eslint。所以你可以设置你自己的 eslint。如果您需要一个忽略文件，您可以使用 --ignore-path 而不是使用 --no-ignore 选项来定义它。

禁用create-react-app提供的ESLint

8 个答案:

步骤1

步骤2