SublimeLinter js和css的語法檢查

JavaScript 語法檢查

SublimeLinter-jshint 是基於 nodeJS 下的 jshint 的插件，實際上 SublimeLinter-jshint 調用了 nodeJS 中 jshint 的接口來進行語法檢查的。

---

安裝 SublimeLinter-jshint

爲了讓 JavaScript 代碼有語法檢查，咱們安裝 SublimeLinter-jshint 
一樣的方法，咱們安裝 SublimeLinter-jshint

1. 按下 Ctrl+Shift+p 進入 Command Palette
2. 輸入install進入 Package Control: Install Package
3. 輸入SublimeLinter-jshint。進行安裝.

以下圖

安裝完成後咱們能夠看到下面的一段話

1. SublimeLinter-jshint
2. -------------------------------
3. This linter plugin for SublimeLinter provides an interface to jshint.
4.  
5. ** IMPORTANT! **
6.  
7. Before this plugin will activate, you *must*
8. follow the installation instructions here:
9.  
10. https: //github.com/SublimeLinter/SublimeLinter-jshint

---

安裝 nodeJS 和 jshint

在插件開始工做以前，咱們必須再看一下上述插件的安裝說明 
經過 SublimeLinter-jshint 的說明 咱們能夠看到，這個組件依賴於 nodeJS 下的 jshint，因此咱們安裝 nodeJS 環境和 nodeJS 下的 jshint。

1. 安裝 Node.js （如何安裝配置在sublime text，在下一條博客）
2. 經過 npm 安裝jshint （注意這個命令 npm install -g jshint是放在cmd運行，而不是sublime text的控制檯）


在命令行下輸入以下代碼，完成安裝

1. npm install -g jshint

安裝完成後命令行中出現以下的信息

1. C:\Users\Administrator\AppData\Roaming\npm\jshint -> C:\Users\Administrator\AppData\Roaming\npm\node_modules\jshint\bin\jshint
2. jshint @2.6.3 C:\Users\Administrator\AppData\Roaming\npm\node_modules\jshint
3. ├── strip-json-comments @1.0.2
4. ├── underscore@1.6.0
5. ├── exit@0.1.2
6. ├── shelljs@0.3.0
7. ├── console-browserify@1.1.0 (date-now@0.1.4)
8. ├── htmlparser2 @3.8.2 (domelementtype@1.3.0, entities@1.0.0, domhandler@2.3.0, readable-stream@1.1.13, domutils@1.5.1)
9. ├── minimatch @1.0.0 (sigmund@1.0.0, lru-cache@2.5.0)
10. └── cli @0.6.6 (glob@3.2.11)

能夠查看 jshint 版本，已確認安裝完成。

1. C:\Users\Administrator>jshint -v
2. jshint v2.6.3

如今，恭喜你，咱們使用 Sublime 編輯 JavaScript 文件，就會有語法檢查了！

在編輯過程當中，會有以下提示

點擊提示點後，Sublime 狀態欄也會有相應的說明

---

css 語法檢查

與 jshint 同理，SublimeLinter-csslint 也是基於 nodeJS 下的 csslint 的插件，實際上 SublimeLinter-csslint 調用了 nodeJS 中 csslint 的接口來進行語法檢查的。

---

安裝 SublimeLinter-csslint

一樣的方法。

1. 按下 Ctrl+Shift+p 進入 Command Palette
2. 輸入install進入 Package Control: Install Package
3. 輸入SublimeLinter-csslint。進行安裝.

以下圖

安裝完成後咱們能夠看到下面的一段話

1. SublimeLinter-csslint
2. -------------------------------
3. This linter plugin for SublimeLinter provides an interface to csslint.
4.  
5. ** IMPORTANT! **
6.  
7. Before this plugin will activate, you *must*
8. follow the installation instructions here:
9.  
10. https: //github.com/SublimeLinter/SublimeLinter-csslint

在使用插件以前，必須遵循上述網址中的安裝說明

---

在 nodeJS 下安裝 csslint

進入上述的 GitHub 地址，csslint 的說明頁。咱們知道了和 jshint 同樣，csslint 也是基於 nodeJS 下的 csslint 來使用的。

這裏安裝 nodeJS 過程省略。 
只需用 npm 安裝 csslint 便可。

在命令行中輸入

1. npm install -g csslint

安裝完成後命令行中出現以下的信息

1. C:\Users\Administrator\AppData\Roaming\npm\csslint -> C:\Users\Administrator\AppData\Roaming\npm\node_modules\csslint\cli.js
2. csslint@0.10.0 C:\Users\Administrator\AppData\Roaming\npm\node_modules\csslint
3. └── parserlib@ 0.2.5

能夠查看 csslint 版本，已確認安裝完成。

1. C:\Users\Administrator>csslint --version
2. v0.10.0

如今，恭喜你，咱們使用 Sublime 編輯 css 文件，就會有語法檢查了！

在編輯過程當中，會有以下提示

點擊提示點後，Sublime 狀態欄也會有相應的說明