怪しいコードを自動で見つけよう

eslint-pretieer.md

コードの書き方を統一する

コードの品質を保つためには機会で判定できることはできるだけ機会にやらせるほうがよい。 JavaScriptは特に柔軟な言語といわれていて、良くないと言われる書き方ができてしまう。

そこでルールに違反したコードを自動検出してくれるeslintを紹介する。

{
  "name": "sample",
  "version": "0.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "lint": "eslint src",
    "fixlint" : "eslint --fix src"
  },
  "devDependencies": {
    "eslint": "^5.6.0",
    "@cybozu/eslint-config": "^2.0.2",
    "prettier": "^1.14.3"
  }
}

package.jsonを配置して npm install すればツールがインストールされる。

/* http://api.jquery.com/jquery.ajax/ */
$.ajax({
  accepts: {
    mycustomtype: 'application/x-some-custom-type'
  },
 
  // Instructions for how to deserialize a `mycustomtype`
  converters: {
    'text mycustomtype': function(result) {
      // Do Stuff
      return newresult;
    }
  },
 
  // Expect a `mycustomtype` back from server
  dataType: 'mycustomtype'
});

• npm run lint でJavascriptのチェック
• npm run fixlint で自動修正できるところは修正

VSCodeとの統合をしてみる

ESLintとPrettierはVSCodeの拡張があるので利用してよう！