webpack-dev-serverでconfigを整理した時にやったミスに気付かず1日悩んだのでメモ。
環境
webpack-dev-server 3.3.0
webpack 4.29.6
node 11.3.0
npm 6.7.0
typescript 3.4.2
ts-loader 5.3.3
環境ってどこまで書けば良いのやら。。。
問題
typescriptをwebpackでコンパイル & eslintで構文チェックなどをやるとdevserverでのみ
ℹ 「wdm」: Compiled successfully.
ℹ 「wdm」: Compiling...
となってコンパイルが終わらないうえ^C
で終了もできないという現象
結論
ts-loader
↓
eslint
となっているのを
eslint
↓
ts-loader
にすると治った
格闘
stackoverflowなどを回ってもなかなか情報がない
↓
ひたすらプラグインをon/offしてみる
↓
治るどころかプロセスが増える
↓
消す
↓
https://qiita.com/riversun/items/d27f6d3ab7aaa119deab
この記事を見てメモリ上にデータがあるということを知る
↓
メモリ上にあるなら(devserverなら)意味ない物をdevserverならoff、でなければonという形にした
ここでeslintの存在を思い出す(重要)
↓
eslintのfixオプションをoffにして見る
↓
大量のエラー!
(インデント関係でした)
↓
不思議に思ってconfigを眺める
↓
もしかしてtscのコンパイル後の結果のインデントが元のファイルに沿ってなかったんじゃね?と思ってeslintとts-loaderを入れ替える
↓
エラーが出なくなる
経緯
configのrolesを見直した時になんとなくeslintをts-loaderの後に記載したのが原因
もともとenforce: true
と書いてあったが意味がわからず消してしまった
次から帰る前にドキュメント読もう。