有沒有辦法在不彈出的情況下為 create-react-app 更改 webpack 的 eslint

Question

我想在不彈出的情況下更改反應應用程序的 eslint 規則。

Answer 1

我們可以通過以下 3 個簡單步驟添加新的 ESLint 規則。

1. 在項目的 src 文件夾下創建 .eslintrc.js。

2. 在文件中添加以下幾行：

   module.exports = { "extends": "react-app", "rules" : { "indent": ["error", 4] // 例如自定義樣式相關規則 // 此處有更多自定義規則 } }

這樣，我們將告訴我們的 IDE 擴展 create-react-app 提供的基本 ESLint 規則，然后遵循我們定義的一些規則。

3. 在您的package.json ，添加以下腳本：

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

這主要是針對 CLI 和 CI/CD 環境的。

現在大多數 IDE 的默認設置是它們將從 src/.eslintrc.js 讀取配置。 因此，您現在也應該在 IDE 上看到來自自定義 eslintrc 文件的錯誤/警告

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

將.eslintrc文件添加到項目的根目錄，並在其中擴展eslint-config-react-app並添加您的規則/覆蓋，例如

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