Intellij插件：爱彼迎ESLint W/React

Question

下面是我在Languages&Frameworks>javascript>code quality tools>ESLINT的设置。下面是我在IntelliJ中的NodeJS/NPM设置。

和我的.eslintrc文件，位于根项目目录中：

{
  "extends": "airbnb",
  "rules": {
    "comma-dangle": 0
  }
}

以下是/index.js中的一个片段，它在IntelliJ中不会产生错误或警告：

var superman = {
    default: { clark: "kent" },
    private: true
};

   4:1   error    Unexpected var, use let or const instead                      no-var
   5:5   error    Expected indentation of 2 space characters but found 4        indent
   5:23  error    Strings must use singlequote                                  quotes
   6:5   error    Expected indentation of 2 space characters but found 4        indent

Answer 1

<代码>文件>设置>插件>浏览存储库...>搜索:eslint>安装>重新启动Webstorm

文件>设置>语言和框架>JavaScript>代码质量工具>eslint

之后它应该是这样工作的：

npm install --save-dev eslint-config-airbnb eslint

{
  "extends": "airbnb"
}

{
  'extends': 'airbnb',
  'rules': {
    'indent': [2, 'tab', { 'SwitchCase': 1, 'VariableDeclarator': 1 }],
    'react/prop-types': 0,
    'react/jsx-indent-props': [2, 'tab'],
  }
}

要创建自己的预置，必须创建名为eslint-config-myname的npm包，然后使用'extends':'myname'，http://eslint.org/docs/developer-guide/shareable-configs

您可以使用命令行检查eslint是否有效：

./node_modules/.bin/eslint .

不过，您可以在。eslintignore中从eslinting中排除某些文件（默认情况下排除node_modules）：

bundle.js

root = true

# Unix-style newlines with a newline ending every file
[*]
end_of_line = lf
insert_final_newline = true


# Matches multiple files with brace expansion notation
# Set default charset
[*.{js,jsx,html,sass}]
charset = utf-8
indent_style = tab
indent_size = 4
trim_trailing_whitespace = true

# don't use {} for single extension. This won't work: [*.{css}]
[*.css]
indent_style = space
indent_size = 2

我还有一个github存储库，已经将这些文件设置为https://github.com/rofrol/react-starter-kit/

基于此https://www.themarketingtechnologist.co/how-to-get-airbnbs-javascript-code-style-working-in-webstorm/

更多信息请参见https://www.jetbrains.com/webstorm/help/using-javascript-code-quality-tools.html