TypeScriptプロジェクト構成案
生のJavaScriptで最後まで書いてしまった Uber売上変換ツール をTypeScriptで書き直すために、TypeScriptのプロジェクト構成について調査したところ、それだけで一本記事にした方が良さそうだったので。 最終的には こんな感じ になりました。事前に必要な環境はちゃんとNode.jsだけにしてあります。(Windowsでしか確認してないので、他のOSだとライセンス更新コマンドあたりが動作しないかもしれませんが・・・) package.json Node.js( ※バージョン情報 )があれば、npm installで環境構築完了。 npm startでデバッグしながら開発。 (デフォルトのポートが8080なので、Tomcatと競合するのに注意) ライブラリを更新したらnpm run licenseで権利情報も更新。 最後はnpm run build。 tsconfig.json tsconfig.json 内の「target」と「module」は両方「es2020」にしました。 資料 を見た限り、es2015にするのがよくある選択肢なのかな?と思いましたが、売上変換ツールで使っている async系が2017の機能 のため、できるだけ新しくすることに。まあ2020くらいで良いか、という感じです。あんまり新しすぎるとブラウザが対応してなかったりしますし。 moduleを「CommonJS」にすると「Tree Shaking」という不要なコードを削除する機能が使えなくなる ため、避けた方が良いそうです。 webpackの設定 製品版のビルドの分け方の資料 が公式にあったので、大体パクリました。 違いは後述する外部ライブラリの権利情報HTML用の設定と、ビルド時にブラウザキャッシュ対策でハッシュ値をファイル名にいれてるくらいです。 あと、 clean-webpack-plugin を使ってる人もいるようなのですが、「clean: true」で充分だったため、使ってません。 外部ライブラリの権利情報 npmで外部ライブラリを簡単にインストールできるのは良いのですが、権利情報をどう管理するか調べた結果、 lic...