猫でもわかるWebプログラミングと副業

本業エンジニアリングマネージャー。副業Webエンジニア。Web開発のヒントや、副業、日常生活のことを書きます。

とりあえず TypeScript を動かすまで

f:id:yoshiki_utakata:20190711162433p:plain

前提

  • node, npm はインストール済み

npm init

npm init を叩いて適当に package.json を作成する。

npm install typescript

npm install typescript

以下が package.json に追記された。

+  "dependencies": {
+    "typescript": "^3.5.3"
+  }

.gitignore に以下を追記

node_modules

index.ts を用意

const message:string = 'Hello! TypeScript!';
console.log(message);

コンパイル

当たり前だけどそのままでは動かない(console.logだけだとそのまま動いてしまうので、動かないコードの方がいい)。

$ node index.ts

const message:string = 'Hello! TypeScript!';
      ^^^^^^^

SyntaxError: Missing initializer in const declaration
    at Module._compile (internal/modules/cjs/loader.js:718:23)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:785:10)
    at Module.load (internal/modules/cjs/loader.js:641:32)
    at Function.Module._load (internal/modules/cjs/loader.js:556:12)
    at Function.Module.runMain (internal/modules/cjs/loader.js:837:10)
    at internal/main/run_main_module.js:17:11

コンパイルする

package.json に追記

   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "compile": "tsc ./index.ts"
   },

npm run compile

$ npm run compile

> nvapi-client-test@ compile /Users/yoshiyuki_sakamoto/nvapi-client-test
> tsc ./index.ts

index.js ができる

動かす

$ node index.js
Hello! TypeScript!

動いた。