(docker/lint/format/tsのまま実行/autoreload)JavaScriptExpressTypeScriptDockerやることステップごとに分けてあるので、導入したい箇所だけつまみ食いすることも可能です。8.12を使用しています。記事内で「あれ?--saveしてなくない?」とならないように一言補足。準備(追記)エディタ補完を効かせるには結局MacにNode.js入れないといけなかったりしましたが、VSCodeがDockerコンテナのリモート開発に対応したりして潮目も変わってきたので過激派用の設定も追記しました。ベースイメージはお好みで普通のでもalpineでも。package.jsonとpackage-lock.jsonを先にコピー。それ以外のファイル変更時は同コマンドにはキャッシュ利用で飛ばされるため、ビルド時間を短縮できる。その他ファイルをコピー。作成dockerコマンド叩くときに毎回引数つけるのが面倒なので、docker-compose作ります。bash以降、別段コメントがなければbashコマンドはdocker内で実行します。-dオプション無しで起動してる場合はCtrl+cでも止められます。upは、2回目以降は実は毎回ビルドしなくても良かったりします。docker-compose.ymlファイルのvolumesに書いてある通りファイルの変更はdockerの中でいじろうがホスト側でいじろうが常に双方向に更新されます。キャッシュが効いて高速にビルドされるとはいえ、数秒の待ちが煩わしい人は普段は--buildなし、何か挙動がおかしくなったら--build付けて再ビルドがお手軽かなと思います。堅実に生きたい人は常に--buildで。@types/expresssrc/index.jsをsrc/index.tsに名前変更とりあえずトランスパイル出来ることだけを確認したいので、中身は変更しない。(TSなら普通こっちですかね。distから走るように修正。Macの別窓terminalで実行。走っている場合はCtrl+Cで一度止める。Pluginへの移行が推奨されています。ことが発表されました。----------(ESLintの場合はこのブログ記事が参考になります。ESLint(あるいはTSLint)とPrettierを併用する)リンターとフォーマッターの導入です。両方入れる方法はいくつかあるのですが、ここではTSLintにPrettierの処理もまかせる方式で行きます。この方式だと、設定ファイルがtslint.json一箇所にまとまって見通しが良くなります。ESLintのルールとしてPrettierを読み込む(optional)ベースルールを使用したい人は導入します。僕の場合はeslintのstandardが好きなので、そのルールをTSに合うようにカスタマイズされたtslint-config-standardを使用します。tslint-config-standardtslint.jsonファイルを作成し、設定を書きます。extendsのtslint-config-standardは上記で導入したルールに読み替えてください。入れなかった場合はtslint-config-prettierだけ記述すればOKです。TSLintに任せる方法の場合、prettier設定もここに書くことになります。設定内容はstandardだとsingleQuoteとsemiだけ気をつければ多分大丈夫です。完全に僕の好みですが行あたり80文字は短すぎるので長めにしてあります。}}上記を動かせるように、lintコマンドを追加します。informationの警告が大量に出るため付けています。テストディレクトリを含めるかどうかはお好みで。lintコマンドのオプションは色々な指定方法があるので、PJに合わせて適宜変更してください。作成したlintコマンドテストをテスト。lint自動修正できないものは無理ですが、修正できるものはこれで一発修正されます。standardルールなら、最初に作ったsrc/index.tsの;が全部吹っ飛んだはずです。すれば保存のたびにLint+Prettierしてくれます。webし直さなければなりません。いうわけで、ts-nodeを入れます。こいつを入れることで、nodeコマンドでjsファイルを実行するのと同じようにts-nodeでtsファイルを実行できるようになります。devコマンドでnodeではなくts-nodeを使用し、srcのtsファイルを直接読むようにします。本番環境ではトランスパイル後の生jsを走らせると思うのでdistからの実行コマンドを別で用意します。ts-nodeは例によってローカルインストールのため、パスが通るように手動でscriptに追加します。本番実行用のコマンド。これの前にtscも走らせること。開発環境用のコマンド。Macの別窓terminalで実行。走っている場合はCtrl+Cで一度止める。webトランスパイルしなくても、直接tsファイルを読み出すようになりました。start'し直さなければなりません。いうわけで、nodemonを入れます。こいつを入れることでコードの変更を検知してサーバーをオートリロード出来るようになります。実際に実行するコマンド。先程のts-nodeのコマンドです。Macの別窓terminalで実行。走っている場合はCtrl+Cで一度止める。web試しにsrc/index.jsのconsole.logのコメントをちょっといじって保存してみて下さい。docker-composeの実行画面にリロード状況が出て、リロード後ブラウザでlocalhost:3000を開き直すと変更が適用されているのが分かると思います。Express.js開発環境を手に入れることができました。prettier等の各種設定はプロジェクトにより色々変わってくると思うので、この記事はあくまでベースとして使用して修正加えてください。upLoginユーザーは見つかりませんでした。