首頁 > 開發工具 > sublime > Sublime Text 中設定 ESLint

Sublime Text 中設定 ESLint

藏色散人
發布: 2019-09-12 13:47:32
轉載
2590 人瀏覽過

Sublime Text 中設定 ESLint

ESLint

ESLint 是一個有效的程式碼品質控制工具,它可以根據預先制定的程式碼規格來避免低階程式碼錯誤的出現,以及保證程式碼樣式風格的統一。以下由sublime使用教學欄位為大家介紹Sublime Text 中設定 ESLint的方法。

安裝

你可以使用npm 來安裝ESLint:

npm install eslint -g
登入後複製

用法

如果你第一次使用ESLint,那麼你需要先設定一個設定文件,你可以在專案根目錄下使用--init 選項來產生:

eslint --init
登入後複製

如果專案根目錄下沒有package.json 文件,它會提示你先使用npm init 來初始化一個package.json 檔案。

eslint --init 會提示你選擇使用的程式碼樣式,你可以根據需求進行選擇,這裡推薦如下選擇:

Use a popular style guide
Standard
JavaScript
登入後複製

在這個過程中eslint 會自主的進行npm install 操作來安裝相關依賴,在安裝完成之後請注意是否有UNMET PEER DEPENDENCY 項的依賴,這表示NPM 無法自動的進行這個依賴的安裝,你需要手動的去進行安裝:

# ├── UNMET PEER DEPENDENCY eslint-plugin-promise@^1.0.8
npm install eslint-plugin-promise --save-dev
登入後複製

集成Sublime Text

在Sublime Text 中你需要安裝兩個外掛:

SublimeLinter
SublimeLinter-contrib-eslint
登入後複製

然後透過Preferences->Package Settings->SublimeLinter->Settings - User 進行整合:

{
    "user": {
        "debug": true, # 开启 debug 选项
        "delay": 0.25,
        "error_color": "D02000",
        "gutter_theme": "Packages/SublimeLinter/gutter-themes/Default/Default.gutter-theme",
        "gutter_theme_excludes": [],
        "lint_mode": "background",
        "linters": {
            "eslint": {
                "@disable": false,
                "args": [],
                "excludes": []
            },
            "jshint": {
                "@disable": false,
                "args": [],
                "excludes": []
            },
            "php": {
                "@disable": false,
                "args": [],
                "excludes": []
            }
        },
        "mark_style": "outline",
        "no_column_highlights_line": false,
        "passive_warnings": false,
        "paths": {
            "linux": [],
            "osx": [
                "/Users/wang/.nvm/versions/node/v5.0.0/bin" # 设置 node 路径
            ],
            "windows": []
        },
        "python_paths": {
            "linux": [],
            "osx": [],
            "windows": []
        },
        "rc_search_limit": 3,
        "shell_timeout": 10,
        "show_errors_on_save": false,
        "show_marks_in_minimap": true,
        "syntax_map": {
            "html (django)": "html",
            "html (rails)": "html",
            "html 5": "html",
            "javascript (babel)": "javascript",
            "magicpython": "python",
            "php": "html",
            "python django": "python",
            "pythonimproved": "python"
        },
        "warning_color": "DDB700",
        "wrap_find": true
    }
}
登入後複製

到這裡,整合完成,如果你專案中的JavaScript 程式碼風格不符合JavaScript Standard Style 的話,Sublime Text 會給出異常提示。

以上是Sublime Text 中設定 ESLint的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:jianshu.com
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板