javascript 代码校验器 eslint: 在 sublime text 编辑器中安装和配置 eslint

目录
[隐藏]

当你在使用 ES6+ 书写前端代码的时,eslint 是必备的代码校验器。

下面为你介绍在 sublime text 3 编辑器中配置 eslint 的方法步骤。

1. 安装 eslint

打开 cmd 命令提示符,使用 node 进行全局安装 eslint

npm i eslint -g –registry=http://registry.npm.taobao.org/ –disturl=https://npm.taobao.org/dist
npm i babel-eslint -g –registry=http://registry.npm.taobao.org/ –disturl=https://npm.taobao.org/dist

如果你使用 react.js 框架,还应当安装 eslint-plugin-react 插件:

npm i eslint-plugin-react -g –registry=http://registry.npm.taobao.org/ –disturl=https://npm.taobao.org/dist

2. 安装 sublime text 相关插件

打开 sublime text,打开 preferences->Package Control (ctrl+shift+l),搜索和安装如下两个插件:

SublimeLinter
SublimeLinter-eslint

3. 初始化校验配置

进入项目根目录,新建一个名称为 .eslintrc 的文件,录入相关配置。
或者 cmd 命令提示符中进入项目根目录,执行如下命令,初始化生成一个 .eslintrc 文件:

eslint –init

通过以上步骤即完成对 sublime text 的 eslint 配置。

如遇到更多的问题,欢迎留言交流。

附:

一份 .eslintrc 参考(如项目代码均在D盘,可以将它建立在D盘根目录):

{
    //ignored some files
    "parser": "babel-eslint",
    "env": {
        "browser": true,
        "node": true,
        "es6": true
    },
    "globals": {
        "jest": true,
        "describe": true,
        "it": true,
        "expect": true,
        "$": true,
        "require": true,
        "define": true,
        "module": true,
        "MZ": true,
        "console": true,
        "window": true
    },
    "rules": { //0 关闭,1 警告,2 错误
        "block-scoped-var": 0,                  //把 var 语句看作是在块级作用域范围之内
        "curly": 1,                             //为所有控制语句指定花括号约定,警告
        "eol-last": 0,                          //强制文件最后一行为空行,关闭
        "eqeqeq": 1,                            //- 要求使用 === 和 !==
        "dot-notation": 2,                      //尽可能的使用点符号
        "no-console": 0,                        //不允许存在 console。关闭
        "no-empty": 1,                          //空的代码块
        "no-multi-spaces": 1,                   //不允许多个空格
        "no-self-compare": 1,                   //禁止自身比较
        "no-shadow": 2,                         //定义的变量不允许已在外层作用域定义
        "no-undef": 2,                          //变量未定义
        "no-underscore-dangle": 0,              //禁止标识符中有悬空下划线。关闭
        "no-unused-expressions": 1,             // 禁止在语句的位置使用表达式
        "no-unused-vars": 2,                    //变量定义后未使用
        "no-use-before-define": 1,              //不允许在变量定义之前使用它们
        "quotes": [0, "single", "avoid-escape"] //使用单引号
    },
    "extends": "eslint:recommended",
    "ecmaFeatures": {
        "jsx": true,
        "experimentalObjectRestSpread": true
    },
    "plugins": [
        "react"
    ]
}

4. 相关参考

http://blog.csdn.net/lj745280746/article/details/49658249
https://github.com/roadhump/SublimeLinter-eslint
http://smocean.github.io/
http://eslint.org/

点赞 (0)

发表评论

电子邮件地址不会被公开。 必填项已用*标注

This site uses Akismet to reduce spam. Learn how your comment data is processed.