我怎样才能让Prettier和ESLint一起工作?

时间:2017-07-19 10:46:13

标签: sublimetext3 eslint prettier

使用Sublime Text 3时,如何让两者一起工作?

在文件保存中,Prettier用双引号替换单引号,而ESLint查找单引号。

如何让两个软件包一起工作?

.eslintrc

{
      "parser": "babel-eslint",
      "extends": "airbnb",
      "plugins": [
        "react",
        "jsx-a11y",
        "import",
        "prettier"
      ],
      "rules": { 
        "no-use-before-define": 0,
        "no-underscore-dangle": 0,
        "no-tabs": 0,
        "no-nested-ternary": 0,
        "indent": 0,
        "no-multi-assign": 0,
        "no-param-reassign": 0,
        "no-var": 0,
        "no-mixed-operators": 0,
        "no-unused-expressions": 0,
        "no-plusplus": 0,
        "no-confusing-arrow": 0,
        "no-case-declarations": 0,
        "vars-on-top": 0,
        "block-scoped-var": 0,
        "global-require": 0,
        "react/sort-comp": 0,
        "react/forbid-prop-types": 0,
        "react/no-unused-prop-types": 0,
        "react/no-multi-comp": 0,
        "react/no-array-index-key": 0,
        "no-trailing-spaces": 0,
        "react/jsx-filename-extension": 0,
        "import/prefer-default-export": 0
      },
      "globals": {
        "window": true,
        "__DEV__": true,
        "expect": true,
        "it": true,
        "navigator": true,
        "fetch": true
      }
    }

1 个答案:

答案 0 :(得分:2)

默认情况下,Prettier配置默认使用双引号,可能与您提取的ESLint配置冲突。

您可以通过以下几种方式让他们工作(最常推荐的方式):

1)安装eslint-config-prettier并在.eslintrc中进行扩展。这样做会关闭ESLint中可能与Prettier冲突的一些与格式相关的规则。

{
  "extends": [
    "airbnb",
    "prettier"
  ]
}

2)更改.prettierrc配置文件

{
  "singleQuote": true,
  ...
}

3)在调用Prettier

时添加命令行选项
$ prettier --single-quote ...

4)关闭quotes配置文件中的ESLint .eslintrc规则:

{
  "rules": {
    "quotes": "off",
   ...
  }
}