WebStorm 如何配置eslint （node.js） win7

step1:安装eslint依赖

方法一：在package.json文件中新增eslint相关依赖，保存后，使用命令npm install

<pre name="code" class="javascript">"devDependencies": { "nodemon": "^1.9.2", "babel-eslint": "^6.1.2", "babel-root-import": "^4.1.3", "eslint": "^3.6.0", "eslint-config-airbnb": "^11.2.0", "eslint-plugin-babel": "^3.3.0", "eslint-plugin-import": "^1.16.0", "eslint-plugin-jsx-a11y": "^2.2.2", "eslint-plugin-react": "^6.3.0" }, "pre-commit": [ "lint" ]

安装命令

npm install 模块名 --save-dev -g

--save-dev 保存模块名到package.json

-g 代表安装全局

step2:新增eslintrc.js文件 ，存放路径与package.json同一目录，文件内容如下

'use strict'; const eslintrc = { extends: ['eslint-config-airbnb'], env: { browser: true, node: true, es6: true, }, parser: 'babel-eslint', parserOptions: { ecmaVersion: 6, ecmaFeatures: { jsx: true, experimentalObjectRestSpread: true, }, }, plugins: [ 'react', 'babel', ], rules: { 'new-cap': ["error", { "capIsNew": false }], 'arrow-body-style': 0, 'react/no-danger': 0, 'react/prop-types': 0, 'react/jsx-no-bind': 0, 'react/no-multi-comp': 0, 'react/jsx-first-prop-new-line': 0, "react/jsx-filename-extension": [1, { extensions: ['.js'] }], 'import/prefer-default-export': 0, 'import/no-unresolved': [2, { "ignore": ["^[~]"] }], 'import/no-extraneous-dependencies': 0, 'no-underscore-dangle': 0, 'no-param-reassign': 0, 'no-return-assign': 0, 'max-len': 0, 'consistent-return': 0, 'no-redeclare': 0, 'semi': [2, "never"], } }; module.exports = eslintrc;

step3:WebStorm中引用eslint

file --> Settings( Default Settings) --> 搜索eslint --> 勾选Enable --> 指定文件ESlint package目录（示例：C:\Users\admin\node_modules\eslint）

假如全局安装（路径在appdata里面，可通过在开始菜单中%appdata%回车查看 路径：C:\Users\jaune\AppData\Roaming\npm\node_modules\eslint）

step4:运行程序 node server.js

step5:重启webstrom

异常信息1：

Cannot find module 'babel-eslint'

解决方案：重新安装所有依赖（npm install -g），并重复step4、step45

异常信息2：

ESLint: Expected linebreaks to be 'LF' but found 'CRLF'. (linebreak-style)

解决方案：选择System-Dependent（settings-Editor->Code-style），并重复step5