ベリー本🫐記録 - 01

環境構築


  • まずターミナルでnodeのバージョンを確認
$ node -v
// => 14.5.15
  • nvmというバージョン管理ツールを使用するので以下のgit hubからコマンドを実行

GitHub - nvm-sh/nvm: Node Version Manager - POSIX-compliant bash script to manage multiple active node.js versions

$ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash

終わると「ターミナルを再起動するンゴ」と出てたのでターミナルを再起動する

そしたらnvm install v16.8.0を入力

$ nvm install v16.8.0  // ← このコマンド
Downloading and installing node v16.8.0...
Downloading https://nodejs.org/dist/v16.8.0/node-v16.8.0-darwin-x64.tar.xz...
################################################################################################ 100.0%
Computing checksum with shasum -a 256
Checksums matched!
Now using node v16.8.0 (npm v7.21.0)
Creating default alias: default -> v16.8.0

$ node -v  // バージョンを確認…                                                                
v16.8.0
// 16.8.0が入りました!やったね!

$ npm init --yes コマンドを打つことでpackage.jsonファイルが生成されるので以下の場所に追記

// package.json
"main": "index.js",
"type": "module", // <-この行を追加
  • $ npm install --save-dev typescript @types/node

※上のコマンドで最新版がインストールされる(今回はこのままでいく)が、 本の中ではきちんとバージョン指定しているので今後エラーが出たらその時は本に書いているよ うにバージョン指定してインストールし直します。


※もしgithubを使うときはこの辺りでリポジトリ作成しておくと良いかもしれない。

github使った場合のために.gitignoreを作成する

  • $ touch .gitignoreでファイルを作成し.gitignore/node_modulesを追記し、gitに上げないようにする

もし、git cloneしたらnode_moduleがない状態になるので

$ npm install

でnode_moduleが再度生成される。


tsconfig.json

$ npx tsc --init

コマンドでtsconfig.jsonファイルが生成されるので更に中身を書き換える

// tsconfig.json

// 以下を書き換える
"target": "es2016",
                            ↓
"target": "es2020",

-----

"module": "commonjs",
                            ↓
"module": "esnext",

------

// "moduleResolution": "node",// コメントアウト外す
"moduleResolution": "node",

------

// "outDir": "./",// コメントアウト外す
"outDir": "./",

------

{
  "compilerOptions": {
   // ...たくさんのコンパイラオプション...
}, // ← , を入れる
  "include": ["./src/**/*.ts"] // ←追記
}

TSファイルをコンパイルする


任意で作成した.tsファイルを.jsコンパイルするには以下のコマンドを入力します

$ npx tsc

そうするとdistディレクトリが作成され、コンパイルされるファイル名が.tsから.jsに書き換えられてdistディレクトリに入っています

--dist
   ∟〇〇.js // ←が出力される
--src
      ∟〇〇.ts
  • tsの型が違う場合エラーを吐きますのでコンパイルされません。

      $ npx tsc           
      src/index.ts:1:7 - error TS2322: Type 'string' is not assignable to type 'number'.
    
      1 const message: number = "Hello, world!";
              ~~~~~~~
    
      Found 1 error in src/index.ts:1
    

出力された.jsファイルを実行するときは

$ node dist/〇〇.js

と打てば実行されます。

// 例)
$ node dist/index.js
Hello, world!