jshint簡(jiǎn)介

jslint是一javascript的語(yǔ)法檢測(cè)，眾多前端自動(dòng)化工具都又用到，編輯器也用到j(luò)shint。
webstorm很強(qiáng)大，自身帶有，但是我使用的電腦帶不動(dòng)。sublime或者atom,兩款非常類似，編輯操作基本是一樣的，以其中一個(gè)為例。

安裝步驟

第1步 安裝插件

sublime的jshint是依賴于sublimeLinter，所以要安裝sublimeLinter。

第2步 安裝node

jshint是npm包，故要安裝node，然后在安裝全局的jshint

npm install -g jshint

第3步 啟動(dòng)jshint

ctrl + shift + P 搜sumlimejshint，然后launch，就可以使用。

第4步 配置

在路徑下新增文檔’.jshintrc’，即可定義規(guī)則。
api參考地址：傳送門。

使用它檢測(cè)es6

.jshintrc 里面 加上 "esnext" : true，新版本的加上 "esversion" : 6

ps: 我按照上面配置，不成功，不能識(shí)別const聲明常量。我又在Tools->jsHing->lint Code看到提示：在要使用es6環(huán)境，請(qǐng)使用

"esversion": {"b"}

or

"moz": true

然而，測(cè)試還是不成功！不建議使用它檢測(cè)es6，要怎么檢測(cè)es6。有誰(shuí)成功請(qǐng)告知，表示感謝。

eslint簡(jiǎn)介

不多廢話，直接看 - ->官網(wǎng)。

當(dāng)使用es6請(qǐng)把jshint關(guān)掉，則檢測(cè)es6的語(yǔ)法，請(qǐng)使用eslint。

穿插個(gè)話題，sublime怎么禁用和啟動(dòng)插件

Preferences→Package Control（ctrl + shift + p），顯示以下彈窗（如果沒(méi)有請(qǐng)輸入）：

• n Disable Package ：禁用插件

• n enable Package ：?jiǎn)⒂貌寮?/p>

• n Install Package ：安裝插件

• n List Package ：查看已安裝插件列表

• n Remove Package ：移除插件

• n Upgrade Package ：升級(jí)插件

img

ps: 在這點(diǎn)上atom,顯得很方便，隨便查看顯示是否禁用狀態(tài)，sublime是分開(kāi)的，查看package是否被禁用，在tool->[對(duì)應(yīng)的包名]--toggle ……，查看報(bào)名下，是否寫著enable 或者 disable。

在禁用linter的擴(kuò)展包，會(huì)提供禁用或啟動(dòng)選項(xiàng)，這倒是很方便。

話歸正題如何安裝eslint

第1步 安裝

1. 安裝插件
   • SublimeLinter
   • SublimeLinter-jshint
   • SublimeLinter-jsxhint
   • SublimeLinter-contrib-eslint
2. 安裝npm包

npm install -g eslint
npm install -g babel-eslint
npm install -g eslint-plugin-react
npm install -g jsxhint

第2步 配置

以ES6語(yǔ)法檢查為例，在項(xiàng)目工程根目錄新建.eslintrc,輸入

{
    "parserOptions": {
        "ecmaVersion": 6,
        "sourceType": "module",
        "ecmaFeatures": {
            "jsx": true
        }
    },
    "rules": {
        "semi": ["error", "always"]
    }
}

本文參考文檔地址：

傳送門1

傳送門2

傳送門3