13

我在变得更漂亮时遇到问题,eslint 和 Visual Studio 代码一起玩得很好。我一直在 VSCode 中看到诸如此类的红色错误:

[eslint] Replace `↹` with `··` (prettier/prettier)

我安装了 VSCode 插件 eslint 和 prettier。

VSCode 配置 { "javascript.validate.enable": false, "javascript.format.enable": false, "editor.formatOnSave": true, "prettier.singleQuote": true, "prettier.eslintIntegration": true, "window.zoomLevel": -1, "editor.fontSize": 13 } .eslintrc

    {
    "parser": "babel-eslint",
    "extends": [
        "airbnb",
        "plugin:react-native/all",
        "prettier",
        "prettier/react",
        "prettier/standard"
    ],
    "parserOptions": {
        "sourceType": "module",
        "ecmaFeatures": {
        "jsx": true
        }
    },
    "env": {
        "browser": true,
        "node": true,
        "mocha": true,
        "jest": true,
        "es6": true
    },
    "globals": {
        "expect": true,
        "sinon": true,
        "Promise": true,
        "__DEV__": true
    },
    "plugins": ["babel", "react", "react-native", "prettier"],
    "settings": {
        "import/resolver": {
        "node": {
            "paths": ["app"]
        }
        }
    },
    "rules": {
        "prettier/prettier": ["error"],
        "indent": [2, "tab", { "SwitchCase": 1 }],
        "comma-dangle": [2, "only-multiline"],
        "react/jsx-indent": [0, "tab"],
        "jsx-quotes": [2, "prefer-double"],
        "react/display-name": 0,
        "react/jsx-boolean-value": 1,
        "react/jsx-no-undef": 2,
        "react/jsx-sort-prop-types": 0,
        "react/jsx-sort-props": 0,
        "react/jsx-uses-react": 1,
        "react/jsx-uses-vars": 1,
        "react/jsx-filename-extension": 0,
        "react/no-did-mount-set-state": 2, // [2, "allow-in-func"],
        "react/no-did-update-set-state": 2,
        "react/no-multi-comp": 0,
        "react/no-unknown-property": 2,
        "react/prop-types": 1,
        "react/react-in-jsx-scope": 2,
        "react/self-closing-comp": 1,
        "react/sort-comp": 2,
        "react/jsx-wrap-multilines": 2,
        "react-native/no-color-literals": 1,
        "quotes": [
        2,
        "single",
        "avoid-escape"
        ]
    }
    }

开发依赖包.json

"devDependencies": {
    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.0",
    "babel-eslint": "^7.2.3",
    "babel-plugin-module-resolver": "3.0.0-beta.5",
    "babel-plugin-react-intl": "^2.3.1",
    "babel-plugin-transform-class-properties": "^6.24.1",
    "babel-plugin-transform-decorators-legacy": "^1.3.4",
    "babel-plugin-transform-es2015-modules-commonjs": "^6.24.1",
    "babel-preset-airbnb": "^2.4.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-react-native": "^4.0.0",
    "babel-preset-react-native-stage-0": "^1.0.1",
    "babel-register": "^6.24.1",
    "chai": "^4.1.0",
    "chai-as-promised": "^7.1.1",
    "chai-enzyme": "^0.8.0",
    "chai-immutable": "^1.6.0",
    "commitizen": "^2.9.6",
    "cz-conventional-changelog": "^2.0.0",
    "enzyme": "^3.1.0",
    "enzyme-adapter-react-16": "^1.0.2",
    "enzyme-to-json": "^3.1.4",
    "eslint": "^4.7.2",
    "eslint-config-airbnb": "^15.1.0",
    "eslint-config-prettier": "^2.7.0",
    "eslint-plugin-babel": "^4.1.2",
    "eslint-plugin-import": "^2.7.0",
    "eslint-plugin-jsx-a11y": "^6.0.2",
    "eslint-plugin-prettier": "^2.3.1",
    "eslint-plugin-react": "^7.4.0",
    "eslint-plugin-react-native": "^3.1.0",
    "eslint-plugin-standard": "^3.0.1",
    "expect.js": "^0.3.1",
    "flow": "^0.2.3",
    "flow-bin": "^0.56.0",
    "immutablediff": "^0.4.3",
    "jest": "^21.2.1",
    "jshint": "^2.9.5",
    "mocha": "^3.4.2",
    "prettier-eslint": "^8.2.1",
    "react-addons-test-utils": "^15.6.2",
    "react-dom": "16.0.0-beta.5",
    "react-intl-cra": "^0.2.8",
    "react-native-mock": "^0.3.1",
    "react-test-renderer": "^16.0.0",
    "redux-debounce": "^1.0.1",
    "redux-debounced": "^0.4.0",
    "redux-devtools": "^3.4.0",
    "redux-devtools-dock-monitor": "^1.1.2",
    "redux-devtools-log-monitor": "^1.3.0",
    "redux-mock-store": "^1.2.3",
    "regenerator-runtime": "^0.11.0",
    "remote-redux-devtools": "^0.5.12",
    "sinon": "^4.0.0"
}
4

6 回答 6

1

您必须安装eslint-config-prettier软件包并在您的 eslint 配置文件中添加prettierextends数组

{
  extends: ['prettier']
}
于 2021-04-03T11:54:45.653 回答
0
npm run lint -- --fix

对我来说没关系,但您必须停用Prettier扩展程序以避免冲突。

于 2021-08-11T13:03:56.217 回答
0

当我将此部分用于.eslintrc文件时,这适用于我的代码。

"extends": [
    "plugin:react/essential",
],
于 2021-07-08T23:38:42.127 回答
0

我找到的解决方案是在保存文件时修改 Visual Studio Code 设置以格式化文件"editor.formatOnSave": true并在保存文件时运行 ESLint "eslint.run": "onSave"您可以在Prettier Formatter for Visual Studio Code中找到更详细的说明。

于 2021-01-13T20:06:37.923 回答
-3

有同样的问题。

{
  "useTabs": false
}

这解决了我的问题

于 2020-04-28T14:25:03.230 回答
-3

使用修复解决

yarn run lint --fix
于 2020-01-11T10:29:05.723 回答