sublime3配置eslint

● Sublime內建 ESLint 需要兩個插件 SublimeLinter 和 SublimeLinter-contrib-eslint ；直接在Package Controll中安裝就好

● 局部安裝ESLint： npm i eslint –save-dev

● 局部安裝eslint-plugin-react： npm i eslint-plugin-react –save-dev

● 局部安裝babel-eslint： npm i babel-eslint –save-dev

● 安裝後修改SublimeLinter的配置檔案，在Package Settings中打開其Setting-User，将下列代碼複制進去：

setting-user配置

{
"user": {
    "debug": true,
    "delay": 0.25,
    "error_color": "D02000",
    "gutter_theme": "Packages/SublimeLinter/gutter-themes/Default/Default.gutter-theme",
    "gutter_theme_excludes": [],
    "lint_mode": "load/save",
    "linters": {
        "eslint": {
            "@disable": false,
            "args": [],
            "excludes": []
        },
        "eslint_d": {
            "@disable": false,
            "args": [],
            "excludes": []
        }
    },
    "mark_style": "solid underline",
    "no_column_highlights_line": false,
    "passive_warnings": false,
    "paths": {
        "linux": [],
        "osx": [],
        "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"
    },
    "warning_color": "DDB700",
    "wrap_find": true
    }
}
           

如果是全局安裝 則把eslint eslint-plugin-react babel-eslint 全局安裝

例如：

● 全局安裝ESLint： npm i eslint -g

● 全局安裝eslint-plugin-react： npm i eslint-plugin-react -g

● 全局安裝babel-eslint： npm i babel-eslint -g

并修改paths下的winddows目錄修改為全局安裝的目錄

例如：

"paths": {
    "linux": [],
    "osx": [],
    "windows": [
        /*目錄根據eslint安裝目錄自己修改*/
        "C:/Users/Administrator/AppData/Roaming/npm/eslint.cmd"
    ]
},
           

配置eslint規則，配置出适合自己程式設計習慣的配置檔案：

.eslintrc.json

{
"plugins": [
"react"
],
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
  "jsx": true
}
},
"parser": "babel-eslint",
"env": {
"es6": true,
"browser": true,
"node": true,
"jquery": true,
"commonjs": true
},
"rules": {
"no-cond-assign": "error",
"no-console": "error",
"no-constant-condition": "error",
"no-debugger": "error",
"no-dupe-args": "error",
"no-dupe-keys": "error",
"no-duplicate-case": "error",
"no-empty-character-class": "error",
"no-empty": "error",
"no-ex-assign": "error",
"no-extra-boolean-cast": "error",
"no-extra-semi": "error",
"no-func-assign": "error",
"no-inner-declarations": "error",
"no-invalid-regexp": "error",
"no-irregular-whitespace": "error",
"no-func-assign": "error",
"no-obj-calls": "error",
"no-regex-spaces": "error",
"no-sparse-arrays": "error",
"no-unexpected-multiline": "error",
"no-unreachable": "error",
"no-unsafe-finally": "error",
"use-isnan": "error",
"valid-typeof": "error",
"accessor-pairs": "error",
"eqeqeq": "error",
"guard-for-in": "error",
"no-alert": "error",
"no-caller": "error",
"no-case-declarations": "error",
"no-else-return": "error",
"no-empty-function": "error",
"no-empty-pattern": "error",
"no-eval": "error",
"no-redeclare": "error",
"radix": "error",
"no-delete-var": "error",
"quotes": ["error", "single"],
"indent": ["error", 4],
"no-lonely-if": "error",
"no-self-assign": "error",
"no-self-assign": "error",
"no-self-assign": "error",
"no-self-assign": "error",
"react/no-array-index-key":"warn",
"react/no-deprecated":"error",
"react/no-find-dom-node":"error",
"react/no-is-mounted":"error",
"react/no-multi-comp":"error",
"react/no-string-refs":"error",
"react/no-unused-prop-types":"error",
"react/prefer-es6-class":"off",
"react/prop-types":"off"
}
}
           

最後，把配置好的檔案放在你項目的根目錄中就可以了，項目中所有的子檔案也會自動使用該配置檔案。