使用ESlint
第一段:ESLint跟JSLint和JSHint类似,但有以下区别:
①使用Espree进行js解析(parse)
②用AST抽象语法树去识别(evaluate)代码中的模式③每个规则都是独立的插件
第二段:安装
全局安装:
npm install -g eslint
第三段:使用
第四段:配置
{
"rules": {
"semi": ["error", "always"],
"quotes": ["error", "double"]
}
提示有三个level:
"off" or 0 - 关闭这个规则校验
第五段:常见问题
①为什么不用jslint
创建eslint是因为急需插件化的校验工具
②ESLint跟JSHint、JSCS的比较
ESLint比JSCS快,(as ESLint uses a single-pass traversal for analysis whereas JSCS using a querying model.)③ESLint仅仅是校验还是也检查代码风格
都有.ESLint does both traditional linting (looking for problematic patterns) and style checking (enforcement of conventions). You can use it for both.
支持.参考配置eslint.org/docs/user-guide/configuring⑤支持JSX?
本身不支持,可以使用babel-eslint
第六段:下面详细介绍下配置,地址eslint.org/docs/user-guide/configuring1.配置ESLint
主要有两种方法配置
(1)配置注释,直接嵌入到js文件中
配置分几个方面:
复制代码
"parserOptions": {
"jsx": true
},
③配置解析器(Specifying Parser),需要本地npm模块{
"parser": "esprima", // Espree(默认) Esprima Babel-ESLint"rules": { "semi": "error" } }
④配置环境(Specifying Environments),可以多选复制代码
browser - browser global variables.
node - Node.js global variables and Node.js scoping.
commonjs - CommonJS global variables and CommonJS scoping (use this for browser-only code that uses Browserify/WebPack).
shared-node-browser - Globals common to both Node and Browser.
worker - web workers global variables.
amd - defines require() and define() as global variables as per the amd spec.
mocha - adds all of the Mocha testing global variables.
jest - Jest global variables.
phantomjs - PhantomJS global variables.
protractor - Protractor global variables.
qunit - QUnit global variables.
jquery - jQuery global variables.
prototypejs - Prototype.js global variables.
shelljs - ShellJS global variables.
meteor - Meteor global variables.
mongo - MongoDB global variables.
applescript - AppleScript global variables.
serviceworker - Service Worker global variables.
atomtest - Atom test helper globals.
embertest - Ember test helper globals.
webextensions - WebExtensions globals.
greasemonkey - GreaseMonkey globals.
如果要在待校验文件里面配置可以这样配置:
/*eslint-env node, mocha */
如果要在配置文件中配置:
"env": {
"browser": true,
"node": true
如果在package.json中配置:
"name": "mypackage",
"version": "0.0.1",
"eslintConfig": {
如果在YAML中配置:
---
env:
browser: true
node: true
也可以用插件
"plugins": ["example"],
"example/custom": true
⑤配置全局变量(Specifying Globals)
定义了全局变量以后,使用他们,ESLint不会发出警告.
在js文件中定义:
设置read only
在配置文件中:
"globals": {
"var1": true,
⑥配置插件(Configuring Plugins)
使用npm安装第三方插件
"plugins": [
"plugin1",
]
⑦配置规则(Configuring Rules)
js中配置:
/*eslint eqeqeq: "off", curly: "error"*/
或者:
如果规则有多个选项:
"eqeqeq": "off",
"curly": "error",
使用插件:
"plugin1"
],
"quotes": ["error", "double"],
"plugin1/rule1": "error"
/*eslint "plugin1/rule1": "error" */
临时关闭eslint校验:
/*eslint-disable */
//Disable all rules between comments
alert('foo');
/*eslint-enable */
/*eslint-disable no-alert, no-console */
console.log('bar');
/*eslint-enable no-alert */
在js特定行关闭校验:
alert('foo'); // eslint-disable-line
// eslint-disable-next-line
alert('foo'); // eslint-disable-line no-alert, quotes, semi// eslint-disable-next-line no-alert, quotes, semialert('foo');
⑧增加共享设置(Adding Shared Settings)
"settings": {
"sharedData": "Hello"
⑨使用配置文件
eslint -c myconfig.json myfiletotest.js
①.0.继承配置文件(Extending Configuration Files)复制代码
"extends": [
"./node_modules/coding-standard/eslintDefaults.js",// Override eslintDefaults.js
"./node_modules/coding-standard/.eslintrc-jsx",],
// Override any settings from the "parent" configuration"eqeqeq": "warn"
①.1.忽略文件或目录(Ignoring Files and Directories)建立.eslintignore文件
# /node_modules and /bower_components ignored by default# Ignore files compiled from TypeScript and CoffeeScript**/*.{ts,coffee}.js
# Ignore built files except build/index.jsbuild/
!build/index.js
以上就是土嘎嘎小编大虾米为大家整理的相关主题介绍,如果您觉得小编更新的文章只要能对粉丝们有用,就是我们最大的鼓励和动力,不要忘记讲本站分享给您身边的朋友哦!!