TypeScriptについてだと、設定( tsconfig.json とか)やコンパイル体制などが必要で、JavaScriptのように、単にエディタとかでJSファイル作ればそれでいい、とはならない(とはいえプロジェクトなら素のJSでもモノによってはNodejsの設定とか必要だが)
が、始める時に毎回いちいち書籍とか関連サイトとか巡ってコード引っ張ってきたりするのも面倒なので、ここにとりあえずこれ打ち込んでおけばOKのメモを記録しておきます
…本当なら自分の頭に記憶していくのが一番いいが、自分の記憶力は壊滅レベルなので
このあたりの手順については、既に書籍やWeb上に色々書いてあると思いますが、今回書く手順についてはオライリー・ジャパンの「プログラミングTypeScript」(ISBN-978-4-87311-904-5)の第2章及び付録Hを参考にしています
TL;DR
コマンドだけ抜き出しておく
このあたり叩き込んで、srcディレクトリにindex.jsとか作ってコード書けばそれだけでいいレベルのもの
環境の用意
npm init
npm i -D typescript
npx tsc --init
npm i D eslint @typescript-eslint/eslint-plugin @typescript-eslint/parser
mkdir src
src下にindex.tsとか作って中身のコード書いてからコンパイル
.\node_modules .bin/tsc
ここまでできれば、あとは
node .\dist\index.js
とかすれば実行できる
前提
自分が今やってる環境が
- Windows10
- VSCode
なので、その中でやる形になります
もちろんコマンド実行は WindowsPowerShell になります
環境の用意
まずはプロジェクト作りたいディレクトリ下にて、プロジェクトのディレクトリを作成します(右クリックでもmkdirでもなんでもいい)
作成できたらPowerShellで、そのプロジェクトのディレクトリ下にcdとかで移動し、次のコマンドを実行します
npm init
npm i -D typescript
npx tsc --init
npm i D eslint @typescript-eslint/eslint-plugin @typescript-eslint/parser
1行目でnpmを初期化します
設定に関して色々対話式で言われますが、面倒なので全部エンターキー押してデフォルト設定すればいです(なのでnpm init -yとかでもいい)
2行目でTypeScriptをインストールします
3行目でtsconfig.jsonを作成します
デフォルト設定で全部やってるので、特に何もなければこれでいいですが、JSファイルの出力先outDirが設定されておらずsrcディレクトリに出力されることになるので、よくある形だと(後からでもエディタなりなんなりで)distに設定しておくといいかもしれないです
4行目でリンターとしてESLintを設定しています
ここまでで、TSコード作成できる準備はだいたいできました
詳しい人から見ればtsconfig.jsonの設定とか色々まだあると思いますが、とりあえず動けばいいのを用意するのが目標なのでここまでで
TypeScriptファイル作成
プロジェクトのディレクトリ下にsrcディレクトリを作り、その中にてきとーな名前つけたtsファイル(よくあるものだとindex.tsあたり)作って、中身のコードを書きます
TypeScriptのコンパイルと完成したJSファイルの実行
すでにnode_moduleディレクトリ配下にTypeScriptコンパイラbin/tscができているので、それを実行します
PCのの設定で制限かかって実行できない場合は、先にSet-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope Processあたりで実行ポリシーの制限を緩めておきましょう
.\node_modules .bin/tsc
(なんかうまく実行できなかったので、cdでnode_modulesに入ってから.bin/tscコマンド実行して対応したりした)
ここまでくればほぼ完了で、distディレクトリ配下(tsconfig.json修正してなければsrc配下)にindex.tsからコンパイルされたindex.jsができてます
このファイル単体で動かしてテストしたい場合は以下のコマンドで実行してみましょう
node .\dist\index.js
実用で書くものとかだとこれだけでは不十分だと思いますが、とりあえず動けばいいもの、自分用メモということで、今回はこれまで