Windows 下 Sublime Text 3 + EsLinter 的使用

配置啥的真的挺烦的, 写篇文章供大家参考
首发网址: http://szhshp.org 
最后更新： 2018-03-09

ESLint

很有名的一款JS代码规范检查用的插件

安装

首先需要npm, 这个没有外部·executable program·的结合是无法使用的

---

安装eslint, 建议全局安装, 省去一些不必要的麻烦:

npm install -g eslint

---

安装完成后测试一下:

eslint -v

---

Linter的使用必须要配置文件, 我们可以在根目录创建一个新的配置文件, 跟着指导一步一步操作即可

eslint --init

---

然后可以对某JS文件进行测试, 看到正确输出的错误信息, 基本上就可以了。

eslint posts.js

G:\Dev\GitRepos\Coding\szhshp-subsites\source\src\templates\posts.js
   1:8   error  'React' is defined but never used              no-unused-vars
   4:1   error  Expected indentation of 4 spaces but found 2   indent
   4:35  error  Missing semicolon                              semi
   6:1   error  Expected indentation of 4 spaces but found 2   indent
   7:1   error  Expected indentation of 8 spaces but found 4   indent
   8:1   error  Expected indentation of 12 spaces but found 6  indent
   9:1   error  Expected indentation of 16 spaces but found 8  indent
  10:1   error  Expected indentation of 12 spaces but found 6  indent
  11:1   error  Expected indentation of 12 spaces but found 6  indent
  12:1   error  Expected indentation of 16 spaces but found 8  indent
  13:1   error  Expected indentation of 12 spaces but found 6  indent
  14:1   error  Expected indentation of 8 spaces but found 4   indent
  15:1   error  Expected indentation of 4 spaces but found 2   indent
  15:4   error  Missing semicolon                              semi
  16:2   error  Missing semicolon                              semi
  18:22  error  'graphql' is not defined                       no-undef
  27:2   error  Missing semicolon                              semi

✖ 17 problems (17 errors, 0 warnings)
  15 errors, 0 warnings potentially fixable with the `--fix` option.

SublimeLinter

比较烦的是Sublime Text 方面的配置

这里用的是ST 3.0版本

首先下载两个Package:

• SublimeLinter
• SublimeLinter-eslint

---

Sublime 端配置

// SublimeLinter Settings - User
{
    "debug": false,
    "paths": {
        "linux": [],
        "osx": [],
        "windows": "D:\\Tools_For_Work\\NodeJS\\node_global\\node_modules\\eslint"
    },
    "syntax_map": {
        "html (django)": "html",
        "html (rails)": "html",
        "html 5": "html",
        "javascript (babel)": "javascript",
        "magicpython": "python",
        "php": "html",
        "python django": "python",
        "pythonimproved": "python"
    }
}

最重要的是paths这个参数, 需要设置到全局的eslint的module的路径, 而且注意斜杠要进行转义

另外有一些格式可以进行配置, 即使用syntax_map参数进行配置, 这个非必须用默认的, 已经有很多功能了