有没有办法在不弹出的情况下为 create-react-app 更改 webpack 的 eslint

Question

我想在不弹出的情况下更改反应应用程序的 eslint 规则。

Answer 1

We can add new ESLint rules by following just 3 simple steps.

1. Create .eslintrc.js under the src folder of the your project.

2. Add the following lines in the file:

   module.exports = { "extends": "react-app", "rules" : { "indent": ["error", 4] // A custom style-related rule for example // More custom rules here } }

This way, we will be telling our IDE to extend the base ESLint rules provided by the create-react-app and then follow some rules defined by us.

3. In your package.json , add the following script:

   "lint:fix": "eslint src/**/*.js --fix",

This is mainly for CLI and CI/CD environment.

Now default setup in most of the IDEs are that they would read the configuration from src/.eslintrc.js. Hence you should now see errors/warnings from your custom eslintrc file on your IDE as well

Src - http://rahulgaba.com/front-end/2019/02/17/Use-custom-eslint-config-in-create-react-app-using-three-simple-steps-No-external-dependencies.html

Answer 2

Add an .eslintrc file to the root of your project and in that extend the eslint-config-react-app and add your rules/overrides, eg

// .eslintrc
{
  "extends": "react-app",
  "rules": {
    // enable additional rules or override from react-app
    "indent": ["error", 4],