JS代碼質量檢查工具,後起之秀-eslint

eslint:javascript代碼質量檢查工具。
目前大環境下主要有三款JS代碼質量檢查工具:jslint、jshint、eslint。
jslint:無需配置,直接使用,因爲配置是定好的。缺點是有限的配置選項,很多規則不能禁用,規範嚴格,擴展性差,無法根據錯誤定位到對應的規則。
jshint:是基於jslint開發的,有了很多參數可以配置,支持配置文件,方便使用,支持了一些常用類庫,支持了基本的ES6,但缺點卻繼承了jshint的一部分:不支持自定義規則、無法根據錯誤定位到對應的規則。
ESLint:默認規則裏面包含了JSLint和JSHint的規則,易於遷移,這一點分明就是在搶jslint、jshint的用戶;可配置爲警告和錯誤兩個等級,或者直接禁用掉,支持插件擴展,可以自定義規則,可以根據錯誤定位到對應的規則,支持ES6,唯一一個支持JSX的工具,缺點是需要進行一些自定義配置,執行速度上不如jslint和jshint。
下面是我平時使用的eslint的配置:

{
  "extends": "eslint:recommended",
  // 環境定義了預定義的全局變量。
  "env": {
    //環境定義了預定義的全局變量。更多在官網查看
    "browser":true,
    "node":true,
    "commonjs":true,
    "amd":true,
    "es6":true,
    "mocha":true
  },
  "parser": "babel-eslint",
  // JavaScript 語言選項
  "parserOptions": {
    // ECMAScript 版本
    "ecmaVersion":6,
    "sourceType":"module",//module
    // 想使用的額外的語言特性:
    "ecmaFeatures": {
      // 允許在全局作用域下使用 return 語句
      "globalReturn":true,
      // impliedStric
      "impliedStrict":true,
      // 啓用 JSX
      "jsx":true
    }
  },
  "plugins": [
    "react",
    "import"
  ],

  /**
   * "off" 或 0 - 關閉規則
   * "warn" 或 1 - 開啓規則,使用警告級別的錯誤:warn (不會導致程序退出),
   * "error" 或 2 - 開啓規則,使用錯誤級別的錯誤:error (當被觸發的時候,程序會退出)
   */
  "rules": {

    ////////////////
    // 可能的錯誤 //
    ////////////////

    // 禁止條件表達式中出現賦值操作符
    "no-cond-assign":2,
    // 禁用 console
    "no-console":0,
    // 禁止在條件中使用常量表達式
    // if (false) {
    // doSomethingUnfinished();
    // } //cuowu
    "no-constant-condition":2,
    // 禁止在正則表達式中使用控制字符 :new RegExp("\x1f")
    "no-control-regex":2,
    // 數組和對象鍵值對最後一個逗號, never參數:不能帶末尾的逗號, always參數:必須帶末尾的逗號,
    // always-multiline:多行模式必須帶逗號,單行模式不能帶逗號
    "comma-dangle": [1,"always-multiline"],
    // 禁用 debugger
    "no-debugger":2,
    // 禁止 function 定義中出現重名參數
    "no-dupe-args":2,
    // 禁止對象字面量中出現重複的 key
    "no-dupe-keys":2,
    // 禁止重複的 case 標籤
    "no-duplicate-case":2,
    // 禁止空語句塊
    "no-empty":2,
    // 禁止在正則表達式中使用空字符集 (/^abc[]/)
    "no-empty-character-class":2,
    // 禁止對 catch 子句的參數重新賦值
    "no-ex-assign":2,
    // 禁止不必要的布爾轉換
    "no-extra-boolean-cast":2,
    // 禁止不必要的括號 //(a * b) + c;//報錯
    "no-extra-parens":0,
    // 禁止不必要的分號
    "no-extra-semi":2,
    // 禁止對 function 聲明重新賦值
    "no-func-assign":2,
    // 禁止在嵌套的塊中出現 function 或 var 聲明
    "no-inner-declarations": [2,"functions"],
    // 禁止 RegExp 構造函數中無效的正則表達式字符串
    "no-invalid-regexp":2,
    // 禁止在字符串和註釋之外不規則的空白
    "no-irregular-whitespace":2,
    // 禁止在 in 表達式中出現否定的左操作數
    "no-negated-in-lhs":2,
    // 禁止把全局對象 (Math 和 JSON) 作爲函數調用 錯誤:var math = Math();
    "no-obj-calls":2,
    // 禁止直接使用 Object.prototypes 的內置屬性
    "no-prototype-builtins":0,
    // 禁止正則表達式字面量中出現多個空格
    "no-regex-spaces":2,
    // 禁用稀疏數組
    "no-sparse-arrays":2,
    // 禁止出現令人困惑的多行表達式
    "no-unexpected-multiline":2,
    // 禁止在return、throw、continue 和 break語句之後出現不可達代碼
    /*
     function foo() {
     return true;
     console.log("done");
     }//錯誤
     */
    "no-unreachable":2,
    // 要求使用 isNaN() 檢查 NaN
    "use-isnan":2,
    // 強制使用有效的 JSDoc 註釋
    "valid-jsdoc":1,
    // 強制 typeof 表達式與有效的字符串進行比較
    // typeof foo === "undefimed" 錯誤
    "valid-typeof":2,


    //////////////
    // 最佳實踐 //
    //////////////

    // 定義對象的set存取器屬性時,強制定義get
    "accessor-pairs":2,
    // 強制數組方法的回調函數中有 return 語句
    "array-callback-return":0,
    // 強制把變量的使用限制在其定義的作用域範圍內
    "block-scoped-var":0,
    // 限制圈複雜度,也就是類似if else能連續接多少個
    "complexity": [2,9],
    // 要求 return 語句要麼總是指定返回的值,要麼不指定
    "consistent-return":0,
    // 強制所有控制語句使用一致的括號風格
    "curly": [2,"all"],
    // switch 語句強制 default 分支,也可添加 // no default 註釋取消此次警告
    "default-case":2,
    // 強制object.key 中 . 的位置,參數:
    // property,'.'號應與屬性在同一行
    // object, '.' 號應與對象名在同一行
    "dot-location": [2,"property"],
    // 強制使用.號取屬性
    // 參數: allowKeywords:true 使用保留字做屬性名時,只能使用.方式取屬性
    // false 使用保留字做屬性名時, 只能使用[]方式取屬性 e.g [2, {"allowKeywords": false}]
    // allowPattern: 當屬性名匹配提供的正則表達式時,允許使用[]方式取值,否則只能用.號取值 e.g [2, {"allowPattern": "^[a-z]+(_[a-z]+)+$"}]
    "dot-notation": [2, {"allowKeywords":false}],
    // 使用 === 替代 == allow-null允許null和undefined==
    "eqeqeq": [2,"allow-null"],
    // 要求 for-in 循環中有一個 if 語句
    "guard-for-in":2,
    // 禁用 alert、confirm 和 prompt
    "no-alert":0,
    // 禁用 arguments.caller 或 arguments.callee
    "no-caller":2,
    // 不允許在 case 子句中使用詞法聲明
    "no-case-declarations":2,
    // 禁止除法操作符顯式的出現在正則表達式開始的位置
    "no-div-regex":2,
    // 禁止 if 語句中有 return 之後有 else
    "no-else-return":0,
    // 禁止出現空函數.如果一個函數包含了一條註釋,它將不會被認爲有問題。
    "no-empty-function":2,
    // 禁止使用空解構模式no-empty-pattern
    "no-empty-pattern":2,
    // 禁止在沒有類型檢查操作符的情況下與 null 進行比較
    "no-eq-null":1,
    // 禁用 eval()
    "no-eval":2,
    // 禁止擴展原生類型
    "no-extend-native":2,
    // 禁止不必要的 .bind() 調用
    "no-extra-bind":2,
    // 禁用不必要的標籤
    "no-extra-label:":0,
    // 禁止 case 語句落空
    "no-fallthrough":2,
    // 禁止數字字面量中使用前導和末尾小數點
    "no-floating-decimal":2,
    // 禁止使用短符號進行類型轉換(!!fOO)
    "no-implicit-coercion":0,
    // 禁止在全局範圍內使用 var 和命名的 function 聲明
    "no-implicit-globals":1,
    // 禁止使用類似 eval() 的方法
    "no-implied-eval":2,
    // 禁止 this 關鍵字出現在類和類對象之外
    "no-invalid-this":0,
    // 禁用 __iterator__ 屬性
    "no-iterator":2,
    // 禁用標籤語句
    "no-labels":2,
    // 禁用不必要的嵌套塊
    "no-lone-blocks":2,
    // 禁止在循環中出現 function 聲明和表達式
    "no-loop-func":1,
    // 禁用魔術數字(3.14什麼的用常量代替)
    "no-magic-numbers":[1,{"ignore": [0,-1,1] }],
    // 禁止使用多個空格
    "no-multi-spaces":2,
    // 禁止使用多行字符串,在 JavaScript 中,可以在新行之前使用斜線創建多行字符串
    "no-multi-str":2,
    // 禁止對原生對象賦值
    "no-native-reassign":2,
    // 禁止在非賦值或條件語句中使用 new 操作符
    "no-new":2,
    // 禁止對 Function 對象使用 new 操作符
    "no-new-func":0,
    // 禁止對 String,Number 和 Boolean 使用 new 操作符
    "no-new-wrappers":2,
    // 禁用八進制字面量
    "no-octal":2,
    // 禁止在字符串中使用八進制轉義序列
    "no-octal-escape":2,
    // 不允許對 function 的參數進行重新賦值
    "no-param-reassign":0,
    // 禁用 __proto__ 屬性
    "no-proto":2,
    // 禁止使用 var 多次聲明同一變量
    "no-redeclare":2,
    // 禁用指定的通過 require 加載的模塊
    "no-return-assign":0,
    // 禁止使用 javascript: url
    "no-script-url":0,
    // 禁止自我賦值
    "no-self-assign":2,
    // 禁止自身比較
    "no-self-compare":2,
    // 禁用逗號操作符
    "no-sequences":2,
    // 禁止拋出非異常字面量
    "no-throw-literal":2,
    // 禁用一成不變的循環條件
    "no-unmodified-loop-condition":2,
    // 禁止出現未使用過的表達式
    "no-unused-expressions":0,
    // 禁用未使用過的標籤
    "no-unused-labels":2,
    // 禁止不必要的 .call() 和 .apply()
    "no-useless-call":2,
    // 禁止不必要的字符串字面量或模板字面量的連接
    "no-useless-concat":2,
    // 禁用不必要的轉義字符
    "no-useless-escape":0,
    // 禁用 void 操作符
    "no-void":0,
    // 禁止在註釋中使用特定的警告術語
    "no-warning-comments":0,
    // 禁用 with 語句
    "no-with":2,
    // 強制在parseInt()使用基數參數
    "radix":2,
    // 要求所有的 var 聲明出現在它們所在的作用域頂部
    "vars-on-top":0,
    // 要求 IIFE 使用括號括起來
    "wrap-iife": [2,"any"],
    // 要求或禁止 “Yoda” 條件
    "yoda": [2,"never"],
    // 要求或禁止使用嚴格模式指令
    "strict":0,


    //////////////
    // 變量聲明 //
    //////////////

    // 要求或禁止 var 聲明中的初始化(初值)
    "init-declarations":0,
    // 不允許 catch 子句的參數與外層作用域中的變量同名
    "no-catch-shadow":0,
    // 禁止刪除變量
    "no-delete-var":2,
    // 不允許標籤與變量同名
    "no-label-var":2,
    // 禁用特定的全局變量
    "no-restricted-globals":0,
    // 禁止 var 聲明 與外層作用域的變量同名
    "no-shadow":0,
    // 禁止覆蓋受限制的標識符
    "no-shadow-restricted-names":2,
    // 禁用未聲明的變量,除非它們在 /*global */ 註釋中被提到
    "no-undef":2,
    // 禁止將變量初始化爲 undefined
    "no-undef-init":2,
    // 禁止將 undefined 作爲標識符
    "no-undefined":0,
    // 禁止出現未使用過的變量
    "no-unused-vars": [2, {"vars":"all","args":"none"}],
    // 不允許在變量定義之前使用它們
    "no-use-before-define":0,

    //////////////////////////
    // Node.js and CommonJS //
    //////////////////////////

    // require return statements after callbacks
    "callback-return":0,
    // 要求 require() 出現在頂層模塊作用域中
    "global-require":1,
    // 要求回調函數中有容錯處理
    "handle-callback-err": [2,"^(err|error)$"],
    // 禁止混合常規 var 聲明和 require 調用
    "no-mixed-requires":0,
    // 禁止調用 require 時使用 new 操作符
    "no-new-require":2,
    // 禁止對 __dirname 和 __filename進行字符串連接
    "no-path-concat":0,
    // 禁用 process.env
    "no-process-env":0,
    // 禁用 process.exit()
    "no-process-exit":0,
    // 禁用同步方法
    "no-sync":0,

    //////////////
    // 風格指南 //
    //////////////

    // 指定數組的元素之間要以空格隔開(, 後面), never參數:[ 之前和 ] 之後不能帶空格,always參數:[ 之前和 ] 之後必須帶空格
    "array-bracket-spacing": [2,"never"],
    // 禁止或強制在單行代碼塊中使用空格(禁用)
    "block-spacing":[1,"never"],
    //強制使用一致的縮進 第二個參數爲 "tab" 時,會使用tab,
    // if while function 後面的{必須與if在同一行,java風格。
    "brace-style": [2,"1tbs", {"allowSingleLine":true}],
    // 雙峯駝命名格式
    "camelcase":2,
    // 控制逗號前後的空格
    "comma-spacing": [2, {"before":false,"after":true}],
    // 控制逗號在行尾出現還是在行首出現 (默認行尾)
    // http://eslint.org/docs/rules/comma-style
    "comma-style": [2,"last"],
    //"SwitchCase" (默認:0) 強制 switch 語句中的 case 子句的縮進水平
    // 以方括號取對象屬性時,[ 後面和 ] 前面是否需要空格, 可選參數 never, always
    "computed-property-spacing": [2,"never"],
    // 用於指統一在回調函數中指向this的變量名,箭頭函數中的this已經可以指向外層調用者,應該沒卵用了
    // e.g [0,"that"] 指定只能 var that = this. that不能指向其他任何值,this也不能賦值給that以外的其他值
    "consistent-this": [1,"that"],
    // 強制使用命名的 function 表達式
    "func-names":0,
    // 文件末尾強制換行
    "eol-last":2,
    "indent": [2,4, {"SwitchCase":1}],
    // 強制在對象字面量的屬性中鍵和值之間使用一致的間距
    "key-spacing": [2, {"beforeColon":false,"afterColon":true}],
    // 強制使用一致的換行風格
    "linebreak-style": [1,"unix"],
    // 要求在註釋周圍有空行 ( 要求在塊級註釋之前有一空行)
    "lines-around-comment": [1,{"beforeBlockComment":true}],
    // 強制一致地使用函數聲明或函數表達式,方法定義風格,參數:
    // declaration: 強制使用方法聲明的方式,function f(){} e.g [2, "declaration"]
    // expression:強制使用方法表達式的方式,var f = function() {} e.g [2, "expression"]
    // allowArrowFunctions: declaration風格中允許箭頭函數。 e.g [2, "declaration", { "allowArrowFunctions": true }]
    "func-style":0,
    // 強制回調函數最大嵌套深度 5層
    "max-nested-callbacks": [1,5],
    // 禁止使用指定的標識符
    "id-blacklist":0,
    // 強制標識符的最新和最大長度
    "id-length":0,
    // 要求標識符匹配一個指定的正則表達式
    "id-match":0,
    // 強制在 JSX 屬性中一致地使用雙引號或單引號
    "jsx-quotes":0,
    // 強制在關鍵字前後使用一致的空格 (前後腰需要)
    "keyword-spacing":2,
    // 強制一行的最大長度
    "max-len":[1,200],
    // 強制最大行數
    "max-lines":0,
    // 強制 function 定義中最多允許的參數數量
    "max-params":[1,7],
    // 強制 function 塊最多允許的的語句數量
    "max-statements":[1,200],
    // 強制每一行中所允許的最大語句數量
    "max-statements-per-line":0,
    // 要求構造函數首字母大寫 (要求調用 new 操作符時有首字母大小的函數,允許調用首字母大寫的函數時沒有 new 操作符。)
    "new-cap": [2, {"newIsCap":true,"capIsNew":false}],
    // 要求調用無參構造函數時有圓括號
    "new-parens":2,
    // 要求或禁止 var 聲明語句後有一行空行
    "newline-after-var":0,
    // 禁止使用 Array 構造函數
    "no-array-constructor":2,
    // 禁用按位運算符
    "no-bitwise":0,
    // 要求 return 語句之前有一空行
    "newline-before-return":0,
    // 要求方法鏈中每個調用都有一個換行符
    "newline-per-chained-call":1,
    // 禁用 continue 語句
    "no-continue":0,
    // 禁止在代碼行後使用內聯註釋
    "no-inline-comments":0,
    // 禁止 if 作爲唯一的語句出現在 else 語句中
    "no-lonely-if":0,
    // 禁止混合使用不同的操作符
    "no-mixed-operators":0,
    // 不允許空格和 tab 混合縮進
    "no-mixed-spaces-and-tabs":2,
    // 不允許多個空行
    "no-multiple-empty-lines": [2, {"max":2}],
    // 不允許否定的表達式
    "no-negated-condition":0,
    // 不允許使用嵌套的三元表達式
    "no-nested-ternary":0,
    // 禁止使用 Object 的構造函數
    "no-new-object":2,
    // 禁止使用一元操作符 ++ 和 --
    "no-plusplus":0,
    // 禁止使用特定的語法
    "no-restricted-syntax":0,
    // 禁止 function 標識符和括號之間出現空格
    "no-spaced-func":2,
    // 不允許使用三元操作符
    "no-ternary":0,
    // 禁用行尾空格
    "no-trailing-spaces":2,
    // 禁止標識符中有懸空下劃線_bar
    "no-underscore-dangle":0,
    // 禁止可以在有更簡單的可替代的表達式時使用三元操作符
    "no-unneeded-ternary":2,
    // 禁止屬性前有空白
    "no-whitespace-before-property":0,
    // 強制花括號內換行符的一致性
    "object-curly-newline":0,
    // 強制在花括號中使用一致的空格
    "object-curly-spacing":0,
    // 強制將對象的屬性放在不同的行上
    "object-property-newline":0,
    // 強制函數中的變量要麼一起聲明要麼分開聲明
    "one-var": [2, {"initialized":"never"}],
    // 要求或禁止在 var 聲明周圍換行
    "one-var-declaration-per-line":0,
    // 要求或禁止在可能的情況下要求使用簡化的賦值操作符
    "operator-assignment":0,
    // 強制操作符使用一致的換行符
    "operator-linebreak": [2,"after", {"overrides": {"?":"before",":":"before"} }],
    // 要求或禁止塊內填充
    "padded-blocks":0,
    // 要求對象字面量屬性名稱用引號括起來
    "quote-props":0,
    // 強制使用一致的反勾號、雙引號或單引號
    "quotes": [2,"single","avoid-escape"],
    // 要求使用 JSDoc 註釋
    "require-jsdoc":1,
    // 要求或禁止使用分號而不是 ASI(這個纔是控制行尾部分號的,)
    "semi": [2,"always"],
    // 強制分號之前和之後使用一致的空格
    "semi-spacing":0,
    // 要求同一個聲明塊中的變量按順序排列
    "sort-vars":0,
    // 強制在塊之前使用一致的空格
    "space-before-blocks": [2,"always"],
    // 強制在 function的左括號之前使用一致的空格
    "space-before-function-paren": [2,"always"],
    // 強制在圓括號內使用一致的空格
    "space-in-parens": [2,"never"],
    // 要求操作符周圍有空格
    "space-infix-ops":2,
    // 強制在一元操作符前後使用一致的空格
    "space-unary-ops": [2, {"words":true,"nonwords":false}],
    // 強制在註釋中 // 或 /* 使用一致的空格
    "spaced-comment": [2,"always", {"markers": ["global","globals","eslint","eslint-disable","*package","!"] }],
    // 要求或禁止 Unicode BOM
    "unicode-bom":0,
    // 要求正則表達式被括號括起來
    "wrap-regex":0,

    //////////////
    // ES6.相關 //
    //////////////

    // 要求箭頭函數體使用大括號
    "arrow-body-style":2,
    // 要求箭頭函數的參數使用圓括號
    "arrow-parens":2,
    "arrow-spacing":[2,{"before":true,"after":true}],
    // 強制在子類構造函數中用super()調用父類構造函數,TypeScrip的編譯器也會提示
    "constructor-super":0,
    // 強制 generator 函數中 * 號周圍使用一致的空格
    "generator-star-spacing": [2, {"before":true,"after":true}],
    // 禁止修改類聲明的變量
    "no-class-assign":2,
    // 不允許箭頭功能,在那裏他們可以混淆的比較
    "no-confusing-arrow":0,
    // 禁止修改 const 聲明的變量
    "no-const-assign":2,
    // 禁止類成員中出現重複的名稱
    "no-dupe-class-members":2,
    // 不允許複製模塊的進口
    "no-duplicate-imports":0,
    // 禁止 Symbol 的構造函數
    "no-new-symbol":2,
    // 允許指定模塊加載時的進口
    "no-restricted-imports":0,
    // 禁止在構造函數中,在調用 super() 之前使用 this 或 super
    "no-this-before-super":2,
    // 禁止不必要的計算性能鍵對象的文字
    "no-useless-computed-key":0,
    // 要求使用 let 或 const 而不是 var
    "no-var":0,
    // 要求或禁止對象字面量中方法和屬性使用簡寫語法
    "object-shorthand":0,
    // 要求使用箭頭函數作爲回調
    "prefer-arrow-callback":0,
    // 要求使用 const 聲明那些聲明後不再被修改的變量
    "prefer-const":0,
    // 要求在合適的地方使用 Reflect 方法
    "prefer-reflect":0,
    // 要求使用擴展運算符而非 .apply()
    "prefer-spread":0,
    // 要求使用模板字面量而非字符串連接
    "prefer-template":0,
    // Suggest using the rest parameters instead of arguments
    "prefer-rest-params":0,
    // 要求generator 函數內有 yield
    "require-yield":0,
    // enforce spacing between rest and spread operators and their expressions
    "rest-spread-spacing":0,
    // 強制模塊內的 import 排序
    "sort-imports":0,
    // 要求或禁止模板字符串中的嵌入表達式周圍空格的使用
    "template-curly-spacing":1,
    // 強制在 yield* 表達式中 * 周圍使用空格
    "yield-star-spacing":2
  }
}
發佈了123 篇原創文章 · 獲贊 64 · 訪問量 63萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章