1

在过去的几年里，这一直很有效，但是我们刚刚升级了一些库，现在 eslint，当我们运行我们的应用程序时，并没有引用我们的 eslintrc 文件。它会为我们禁用或设置为警告的规则抛出错误。我可以在 eslintrc 文件中输入 junk 并且构建时没有任何错误。

VSCode 中的 ESLint 扩展确实可以识别它，并且运行 eslint CLI 可以按预期工作。运行npm run startornpm run deploy-build时，似乎忽略了 eslintrc 文件。

.eslintrc.js为简洁起见删除了许多规则

module.exports = {
  "env": {
    "browser": true,
    "jest": true
  },
  "extends": "airbnb",
  "globals": {
    "_satellite": true
  },
  "parser": "babel-eslint",
  "rules": {
    "comma-dangle": 0,
    "eol-last": 0,
    ...
    "jsx-a11y/anchor-is-valid": [
      2,
      {
        "components": [
          "Link"
        ],
        "specialLink": [
          "to"
        ]
      }
    ],
    ...
    "react/jsx-curly-newline": 0, // this is one rule that I'm specifically chasing
    ...
  },
  "settings": {
    "import/resolver": {
      "node": {
        "paths": [
          "src"
        ]
      }
    }
  }
}

craco-config.js

const path = require('path');
const { ESLINT_MODES } = require('@craco/craco');
const StyleLintPlugin = require('stylelint-webpack-plugin');

module.exports = {
  jest: {
    configure: {
      setupFiles: [
        'jest-localstorage-mock',
        '<rootDir>/jest/global_mocks.js',
        '<rootDir>/jest/global_variables.js'
      ],
      testResultsProcessor: 'jest-sonar-reporter',
      snapshotSerializers: [
        'enzyme-to-json/serializer'
      ],
      collectCoverageFrom: [
        'src/**/*.js',
        '!src/registerServiceWorker.js',
        '!src/**/*.stories.js',
        '!src/**/*.styles.js'
      ],
      coverageThreshold: {
        global: {
          branches: 60,
          functions: 70,
          lines: 80,
          statements: 1
        }
      },
      clearMocks: true
    }
  },
  eslint: {
    mode: ESLINT_MODES.file
  },
  webpack: {
    plugins: [
      new StyleLintPlugin({
        configBasedir: __dirname,
        context: path.resolve(__dirname, 'src'),
        files: ['**/*.scss']
      })
    ]
  }
};

local环境

EXTEND_ESLINT=true
REACT_APP_ENV=local
...

package.json

{
  "name": "search",
  "version": "1.0.0",
  "private": true,
  "dependencies": {
    "@datadog/browser-rum": "^1.12.8",
    "@okta/okta-react": "^3.0.4",
    "axios": "^0.18.1",
    "connected-react-router": "^6.7.0",
    "core-js": "^3.6.5",
    "debounce": "^1.2.0",
    "eslint-plugin-react-hooks": "^4.1.0",
    "fast-text-encoding": "^1.0.2",
    "focus-within-polyfill": "^5.0.4",
    "history": "^4.10.0",
    "jshashes": "^1.0.7",
    "lodash.groupby": "^4.6.0",
    "lodash.sortby": "^4.7.0",
    "moment": "^2.24.0",
    "moment-timezone": "^0.5.28",
    "prop-types": "^15.6.2",
    "qs": "^6.5.2",
    "react": "^16.13.0",
    "react-app-polyfill": "^1.0.6",
    "react-click-outside": "^3.0.1",
    "react-cursor-position": "^3.0.3",
    "react-dom": "^16.13.0",
    "react-easy-swipe": "0.0.17",
    "react-flexbox-grid": "^2.1.2",
    "react-html-parser": "^2.0.2",
    "react-inlinesvg": "^1.1.5",
    "react-lazyload": "^2.6.2",
    "react-number-format": "^4.0.5",
    "react-redux": "^7.2.0",
    "react-router": "^5.1.0",
    "react-router-dom": "^5.1.0",
    "react-scripts": "^3.4.1",
    "react-slick": "^0.23.1",
    "react-sticky-el": "^1.0.20",
    "react-toastify": "^4.2.0",
    "react-transition-group": "^4.4.0",
    "reactjs-popup": "^1.5.0",
    "redux": "^4.0.0",
    "redux-devtools-extension": "^2.13.8",
    "redux-logger": "^3.0.6",
    "redux-thunk": "^2.3.0",
    "rxjs": "^6.5.5",
    "semantic-ui-css": "^2.4.1",
    "semantic-ui-react": "^0.83.0",
    "slick-carousel": "^1.8.1",
    "smoothscroll-polyfill": "^0.4.3",
    "styled-components": "^5.1.1",
    "use-clipboard-copy": "^0.1.1",
    "uuid": "^7.0.2"
  },
  "devDependencies": {
    "@craco/craco": "^5.6.4",
    "@storybook/addon-actions": "^5.0.5",
    "@storybook/addon-knobs": "^5.0.6",
    "@storybook/addon-links": "^5.0.5",
    "@storybook/addons": "^5.0.5",
    "@storybook/react": "^5.0.5",
    "@testing-library/react": "^10.4.7",
    "cross-env": "^7.0.2",
    "env-cmd": "^10.1.0",
    "enzyme": "^3.11.0",
    "enzyme-adapter-react-16": "^1.15.2",
    "enzyme-to-json": "^3.5.0",
    "eslint-config-airbnb": "^18.2.0",
    "eslint-plugin-import": "^2.22.0",
    "eslint-plugin-jsx-a11y": "^6.3.1",
    "eslint-plugin-react": "^7.20.6",
    "jest-environment-jsdom": "^24.9.0",
    "jest-environment-node": "^24.9.0",
    "jest-localstorage-mock": "^2.4.0",
    "jest-sonar-reporter": "^2.0.0",
    "jest-styled-components": "^7.0.2",
    "libxmljs": "^0.19.7",
    "node-sass-chokidar": "^1.5.0",
    "npm-link-shared": "^0.5.6",
    "redux-mock-store": "^1.5.3",
    "stylelint": "^9.10.1",
    "stylelint-config-sass-guidelines": "^5.3.0",
    "stylelint-webpack-plugin": "^0.10.5"
  },
  "scripts": {
    "localxf": "cross-env NODE_PATH=src env-cmd -f ./env/localxf craco start",
    "test": "cross-env NODE_PATH=src craco test --env=jsdom",
    "test:debug": "cross-env NODE_PATH=src craco test --runInBand --no-cache --env=jsdom",
    "storybook": "cross-env NODE_PATH=src env-cmd -f ./env/local start-storybook -p 6006",
    "build-storybook": "build-storybook",
    "deploy-build": "cross-env NODE_PATH=src env-cmd -f ./env/deploy-build craco build",
    "start": "cross-env NODE_PATH=src env-cmd -f ./env/local craco start --no-cache"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "ie 11",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version",
      "ie 11"
    ]
  }
}

我怀疑上面有一个库我必须更新，但我不确定还有什么要更新！

4

1 回答 1

0

这似乎是一个可行的解决方法：

eslint: {
  mode: ESLINT_MODES.extends,
  configure: () => {
    // Workaround for broken ESLINT_MODES.file mode
    return require('./.eslintrc')
  }
},
于 2020-08-27T13:42:18.037 回答