简单配置使用eslint校验代码
1.编辑器安装
sublime 安装:
sublimeLinter-contrib-eslint
2.两个配置例子
例一:使用eslint-plugin-react支持react,es6的代码校验
npm install --save-dev eslint-plugin-react eslint
创建eslintrc .eslintrc 配置文件:
{
"env": {
"node": 1,
"browser": 1,
"mocha": true
},
"ecmaFeatures": {
"jsx": true,
"es6": true
},
"plugins": [
"react"
]
"extends": ["eslint:recommended", "plugin:react/recommended"]
}
例二 使用airbnb的代码规范:
npm install --save-dev eslint-config-airbnb eslint-plugin-react eslint
.eslintrc配置文件:
{
"extends": "airbnb",
"env": {
"browser": true,
"node": true,
"mocha": true
},
"ecmaFeatures": {
"forOf": true,
"jsx": true,
"es6": true
},
"rules": {
"comma-dangle": 0,
"indent": [2, 2, {"SwitchCase": 1}],
"react/prop-types": 0
}
}
3.使用webpack
使用webpack我们需要先下载对应的webpack loader
npm install --save-dev eslint-loader
在配置文件中加入:
...
module:{
preLoaders: [
{test: /\.js$/, loader: "eslint-loader", exclude: /node_modules/}
],
loaders:[
{
test:/\.jsx?$/,
exclude:/node_modules/,
loader:'react-hot!babel'
},
{
test:/\.css$/,
loaders:['style','css'],
include:'/dist'
}]
},
eslint: {
failOnWarning: true
}
...
对于其中的一些规则,可查看对应的eslint文档