300字范文,内容丰富有趣,生活中的好帮手!
300字范文 > Web相关:Sublime如何安装ESLint插件?

Web相关:Sublime如何安装ESLint插件?

时间:2020-03-02 09:40:24

相关推荐

Web相关:Sublime如何安装ESLint插件?

论良好的编码风格的重要性。

ESLint为何物?简单的说,它跟jshint类似,都是对JavaScript代码进行语法的检测,但是它提供了更好的扩展性与更丰富的检测机制。

Airbnb JavaScript Style Airbnb的编码风格在社区内公认是比较好的。

如何安装

第一步

通过npm安装ESLint和eslint-config-airbn

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

这一步建议最好是在当前项目中安装, 不要全局安装,我一开始是全局安装,报错了。在github里也看到了别人遇到了类似的问题,导致这个问题的原因就是因为全局安装了该依赖包。

错误如下:

Error: Cannot find module 'eslint-config-airbnb'Referenced from: /Users/adam/projects/webpack-boiler/.eslintrcat Function.Module._resolveFilename (module.js:338:15)at Function.Module._load (module.js:280:25)at Module.require (module.js:364:17)at require (module.js:380:17)at loadConfig (/usr/local/lib/node_modules/eslint/lib/config.js:96:48)at /usr/local/lib/node_modules/eslint/lib/config.js:123:46at Array.reduceRight (native)at loadConfig (/usr/local/lib/node_modules/eslint/lib/config.js:111:36)at getLocalConfig (/usr/local/lib/node_modules/eslint/lib/config.js:225:23)at Config.getConfig (/usr/local/lib/node_modules/eslint/lib/config.js:363:22)webpack-boiler|⇒

安装后之后,package.json文件中会出现这几个字段:

"devDependencies": {"eslint": "^2.5.3","eslint-config-airbnb": "^6.2.0","eslint-plugin-react": "^4.2.3"}

第二步

添加.eslintrc文件

目前文件路径大致如下:

project├node_modules├public├web-project├READDE.md├server.js

大概是长这样。在根目录下,添加一个.eslintrc的文件,内容如下:

{"extends": "airbnb/base","rules": {// disable requiring trailing commas because it might be nice to revert to// being JSON at some point, and I don't want to make big changes now."comma-dangle": 0}}

这个extends有三种不同的值,eslint根据不同的值,检测方式也不一样,具体看这里

第三步

配置json文件。

如果我们是在全局环境下安装ESLint的话,可以在cmd里输入eslint,判断我们是否安装成功。 目前是在当前项目中安装的,所以无法直接使用eslint这个命令,我们得在json文件中配置一下。

在scrip中添加这一行:

"scripts": {"start": "node --harmony server.js","lint": "eslint" //添加这个},

这个时候已经配置好了,可以通过在cmd中运行 npm run lint filename.js。

比如我我要检测根目录下的server.js文件,可以在命令行中键入如下命令:npm run lint server.js

结果如图:

第四步

在sublime中装插件。

通过在sublime中安装插件,可以直接在sublime中看到错误提示。

插件安装参考这里

第五步

重启。

安装好插件之后,需要重启一下。打开一个javascript文件

如图

为甚会报这么多错误呢?因为Airbnb的代码检测真的很严格啊!!!!!!!!!!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。