sounisi5011 commented 5 years ago

目的

プロジェクト開発に必要なlinterやprettierを導入する。

変更内容

[x] 必要なnpmパッケージ等の選定
[x] linterやprettierを依存関係に追加
[x] linterやprettierの設定ファイルを作成
[x] eslint-config-airbnbを依存関係に追加
[x] eslint-config-airbnbを設定ファイルに追加
[x] eslint-config-airbnbに合わせて設定を調整

影響範囲

既存のスクリプトファイルなどを、linterに合わせて修正する必要がある。

補足

現時点では、以下のパッケージを候補として考えている。

eslint
prettierと併用する場合は、eslint-config-prettierとeslint-plugin-prettierも追加する

sounisi5011 commented 5 years ago

Issue #11 の通りにTypeScriptを導入するなら、TSLintやtslint-config-prettier、tslint-plugin-prettierの追加も考えたほうが良いかもしれない。

sounisi5011 commented 5 years ago

Issue #11 の通りにTypeScriptを導入するなら、TSLintやtslint-config-prettier、tslint-plugin-prettierの追加も考えたほうが良いかもしれない。

TSLintはESLintに切り替えられるらしいから、ESLintを使えるならTSLintは導入しない方がいいだろう。

sounisi5011 commented 5 years ago

Issue #11 の通りにTypeScriptを導入するなら、TSLintやtslint-config-prettier、tslint-plugin-prettierの追加も考えたほうが良いかもしれない。

TSLintはESLintに切り替えられるらしいから、ESLintを使えるならTSLintは導入しない方がいいだろう。

ESLintとPrettierを組み合わせる時に使用するeslint-config-prettierが、非推奨になったeslint-plugin-typescriptにしか対応していない可能性がある。新しくなった@typescript-eslint/eslint-pluginが使えるかどうかが不明。

TSLintが廃止されたのは数日前だから、Prettierとの併用がサポートされるのはまだ先かもしれない。となると、一定期間は、古いパッケージを使う必要があるかもしれない。

sounisi5011 commented 5 years ago

eslint-config-prettierで@typescript-eslint/eslint-pluginを使うのは厳しいなコレ。しばらくは非推奨のeslint-plugin-typescriptを使うべきかもしれない。

sounisi5011 commented 5 years ago

eslint-config-prettierで@typescript-eslint/eslint-pluginを使うのは厳しいなコレ。しばらくは非推奨のeslint-plugin-typescriptを使うべきかもしれない。

機能しないらしい。駄目だこりゃ

sounisi5011 commented 5 years ago

Issue #11 での決定により、TypeScriptの導入は一旦見送る。TSLintやtypescript-eslintは、今は導入しない。

sounisi5011 commented 5 years ago

.eslintrc.*の設定方法の書き方がよく分からん…

eslint-config-prettierの設定例だと

{
  "extends": [
    "some-other-config-you-use",  // その他の設定。必ず"prettier"の前に書く
    "prettier"
  ]
}

になっているし、eslint-plugin-prettierの設定例だと

{
  "plugins": ["prettier"],
  "rules": {
    "prettier/prettier": "error"
  }
}

とか

{
  "extends": ["plugin:prettier/recommended"]
}

とか書かれてる。どれ使えば良いんだ…？

sounisi5011 commented 5 years ago

.eslintrc.*の設定方法の書き方がよく分からん…

eslint-config-prettierの設定例だと
{
  "extends": [
    "some-other-config-you-use",  // その他の設定。必ず"prettier"の前に書く
    "prettier"
  ]
}
になっているし、eslint-plugin-prettierの設定例だと
{
  "plugins": ["prettier"],
  "rules": {
    "prettier/prettier": "error"
  }
}
とか
{
  "extends": ["plugin:prettier/recommended"]
}
とか書かれてる。どれ使えば良いんだ…？

"plugin:prettier/recommended"だけでいいらしい。

どうやらこれは、上2つを自動設定するようだ。こことかここにも書いてあったし、それらしいコードも含まれていた。

つまり、本来このように書くべき記述を、

{
  // eslint-config-prettier用の設定
  "extends": [
    "some-other-config-you-use",  // その他の設定。必ず"prettier"の前に書く
    "prettier"
  ],

  // eslint-plugin-prettier用の設定
  "plugins": ["prettier"],
  "rules": {
    "prettier/prettier": "error"
  }
}

このように短縮できるようだ。

{
  "extends": ["plugin:prettier/recommended"]
}

sounisi5011 commented 5 years ago

eslint-plugin-nodeも入れてみたい。

sounisi5011 commented 5 years ago

他に必要な事は無いかな…？

sounisi5011 / vec-draw

linterやprettierの導入 #10

目的

変更内容

影響範囲

補足