ESLint

 

ESLint 簡介javascript

ESLint是由Nicholas C. Zakas編寫的一個Javascript的驗證工具,java

ESLint不只能夠檢驗Javascript錯誤,也能夠進行代碼風格檢測。node

2013年6月發佈第一個版本,最新版本是2015年7月24號發佈的ESLint 1.0.0-rc-3jquery

ESLint主要有如下特色:npm

  (1) 默認規則包含全部JSLint、JSHint中存在的規則,易遷移到ESLintjson

  (2) ESLint相比於JSLint、JSHint,更加靈活強大,規則可配置性很高網絡

  (3) 包含代碼風格檢測的規則工具

  (4) 支持插件擴展、自定義規則ui

 

ESLint在OpenStack中的應用項目spa

1.Horizon

2.Murano

 

ESLint環境搭建

1.安裝NodeJS

  NodeJS是一個基於Chrome JavaScript運行時創建的平臺,使用V8引擎,用於方便地搭建響應速度快、易於擴展的網絡後臺應用。

  下載地址:https://nodejs.org/download/

2.使用NPM安裝ESLint

  NPM的全稱是Node Package Manager,相似pip,經過NPM安裝Nodejs的第三方庫。

  執行命令:npm install eslint

3.執行eslint命令檢測項目中的Javascript文件

  eslint -f junit -o C:\report.xml C:\

  PS: 輸出文件內容格式默認爲"stylish".

    還包括: "compact", "checkstyle", "jslint-xml", "junit","tap".

 

ESLint經常使用配置方式

1.在文件.eslintrc文件配置,支持 JSON 和 YAML 兩種語法。.eslintrc 文件YAML示例:

env:
  # Use jquery global variables
  jquery: true
 # If javascript is running in browser
  browser: true

rules:
  # Specify whether backticks, double or single quotes should be used
  # http://eslint.org/docs/rules/quotes
  quotes:
    - 0
    - 'single'

  # Require camel case names
  # http://eslint.org/docs/rules/camelcase
  camelcase:
    - 1
    - properties: "never"

  # This option sets a specific tab width for your code
  # http://eslint.org/docs/rules/indent
  indent:
    - 2 # Mark as errors.
    - 2 # horizon uses 2 space indentation.

globals:
  # allow accessing horizon
  horizon: false
  # allow accessing horizon
  murano: false

    PS:.eslintrc 放在項目根目錄,則會應用到整個項目;

      若是子目錄中也包含.eslintrc 文件,則子目錄會忽略根目錄的配置文件,應用該目錄中的配置文件。

      這樣能夠方便地對不一樣環境的代碼應用不一樣的規則。

2.在package.json中配置,使用JSON語法。

{
  "version": "0.0.0",
  "private": true,
  "name": "muranodashboard",
  "description": "Murano Dashboard",
  "repository": "none",
  "license": "Apache 2.0",
  "devDependencies": {
    "eslint": "^0.23.0"
  },
  "scripts": {
    "lint": "eslint --no-color muranodashboard/static"
  },
  "eslintConfig": {
    "env": {
      "jquery": true
      "browser": true } }
}

 

ESLint代碼檢測示例

相關文章
相關標籤/搜索