ブルーベリー本輪読会🫐新規リポジトリ作成手順と下準備

  • わからなくなりそうなのでまとめておきます。

1. 新規リポジトリ作成

【 GitHub側 】

  • Github上のNewアイコンをクリックして空のリポジトリ作成。

  • リポジトリ名、Descriptionを記入。
    (例：TypeScript-Rindoku_Ch4)、(例：ブルーベリー本輪読会2024 4章用)

⚠️ Add a README fileにチェックを入れる⚠️
mainブランチが作成されるはず！

image

【 VSCode側 】

  • ローカルリポジトリにクローンする。
$ git clone https://github.com/TypeScript-Rindoku/Ch4.git
  • デフォルトのブランチがmainじゃなかったらmainに変更する。
$ git switch -c main
  • Ch4内に.gitignoreファイルを作成する
.gitignoreファイルの内容

/*/node_modules/
/*/dist/

2. ディレクトリの作成とTypeScriptのインストール

  • TypeScriptプロジェクトの準備
$ mkdir practice
$ cd practice
  • package.jsonを作成する
npm init --yes
  • package.json に "type": "module"を追加
  • TypeScriptをインストールする
npm i --save-dev typescript@4.6.2 @types/node@14.14.10

3. tsconfig.jsonの準備

  • tsconfig.jsonを生成する
$ npx tsc --init
  • targetコンパイラオプション書き換え
"target": "es2016"
↓
"target": "es2020"
  • moduleコンパイラオプション書き換え
"module": "commonjs"
↓
"module": "esnext"
  • moduleResolutionコンパイラオプションをnodeにする
//"moduleResolution": "node"
↓
"moduleResolution": "node"
  • outDirコンパイラオプションを設定
//"outDir": "./"
↓
"outDir": "./dist"
  • includeオプション設定
},
// ↓JSONファイルの一番最後に置く
"include": ["./src/**/*.ts"]
}

4. TypeScriptプログラムを書いてコンパイルする

  • srcディレクトリ内にindex.tsを作成する
    image

  • practiceディレクトリに入り下記コマンドを実行するとdistディレクトリ内にindex.jsが出力される

npx tsc
  • 下記コマンドで実行する
node dist/index.js
Select a repo