仕事の備忘録

IT系技術とか、カスタマーサービスとか

Windows でVisual Studio Code+Typescript実行環境をつくった(参考サイト紹介)

TypescriptをWindows 環境で整えるための方法。完全に備忘録。

技術書典6に参加して手に入れた「りあクト!」第二版。開発が始まる前に思い出して最低限の改修できるようになろうと勉強を始めた(連休を得てもになにも予定がない寂しい日常である)

が、28PからのTypescriptの解説コードを実行しようして思いっきり躓いた。前回の1版はTypescript部分をCodeSnadboxで試したので自前でTypescriptを実行する環境じゃなかった。そこで自分のWindows PCでTypescript実行環境を作っておこうとしたが「りあクト!」はNode.jsに慣れている前提での話なのだからその部分は省略されている。

ということでTypescriptのコンパイル環境を自分で作成した。

基本はこちらのサイトをみて順を追って作成。Typescriptのインストール忘れがちなので注意。この手順だとWindows 環境でも大丈夫。

www.casleyconsulting.co.jp

上記サイトの「HelloWorld.ts」がデバッグで実行できるまで作成できれば「りあクト!」のコードを「HelloWorld.ts」の中身として書き換えて確認できるはず。

ただし、上記サイトで省略されている「tsconfig.jsonの作成」について。ここが設定できないとビルドエラーで先に進まない。悩んで他のサイトにあるサンプルをコピーしてもエラー解消できないので、きちんと調べようとしたら、以下のサイトを発見。非常にわかりやすい。

tyablog.net

以下のコマンドラインで現状のプロジェクトから作り出してくれる。これはありがたい。

tsc --init

これで必要な情報を含んだtsconfig.tsが作成され、ビルドができるようになる。

整えてみて、ボイラーテンプレートであるcreate-react-appが無茶苦茶色々やってくれているのを改めて実感した。