sublime text3 eslint搭配Babel-lint做語法檢查(React)

eslint搭配Babel-lint做語法檢查，以確保團隊的程式碼結構統一。

要用到eslint並搭配使用Babel的話記得在package.json的devDependencies中放入這些項目，這些會裝到node_mudules底下


STEP1:

package.age 格式

    "babel-eslint": "^7.1.1",

    "eslint": "^3.13.1",

    "eslint-config-airbnb": "^13.0.0",

    "eslint-plugin-import": "^2.2.0",

    "eslint-plugin-jsx-a11y": "^2.2.3",

    "eslint-plugin-react": "^6.7.1",

CLI安裝指令：

sudo npm i babel-eslint eslint eslint-config-airbnb eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react

STEP2:

在sublime text3 package install 中安裝SublimeLinter以及SublimeLinter-contrib-eslint, Babel, SublimeLinter這三個，之後在Sublime中的view-syntax就有Babel Javascript語法可以選擇

STEP3:

在專案最上層加入這三個基礎設定檔案

(1).babelrc

檔案內容為：

{

   "presets": ["react", "es2015", "stage-0"]

}

(2).eslintrc

檔案內容為：

{

  "extends": "airbnb",

  "parser": "babel-eslint",

  "rules": {

    "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],

  },

  "globals": {

    "document": true,

  }

}

(3).jshintrc

檔案內容為：

{ 

  "esversion": 6 

}