npmとTurborepoでMonorepo環境を作ったメモ

## 概要
monorepo構成を最小限で試してみた。
[もはや pnpm と Turborepo で Monorepo 環境作れるから](https://zenn.dev/uttk/articles/create-pnpm-monorepo)を参考に、npmで試す。

[ソースコード](https://github.com/hibohiboo/kaminiten/tree/fc513455f16f2347d6902e4c1705060ce8345a08)


## ワークスペースの作成
### フォルダ準備
```bash
# rootのpackage.json作成
$ npm init
# workspace用の設定を記述
# 各パッケージ用ディレクトリ作成
$ mkdir -p packages/lib-a packages/lib-b
```

```json:package.json
{
  "packageManager": "npm@9.8.1",
  "workspaces": [ "packages/*"]
}
```

### パッケージ準備
#### 依存される側

```ts:packages/lib-a/src/index.ts
export const message = 'HELLO WORLD!'
```

```json:packages/lib-a/package.json
{
  "name": "lib-a",
  "main": "./dist/index.js",
  "scripts": {
    "build": "tsc ./src/index.ts --outDir ./dist --declaration"
  },
  "devDependencies": {
    "typescript": "^5.2.2"
  }
}
```

確認
```bash
$ npm run build

> lib-a@0.0.0 build
> tsc ./src/index.ts --outDir ./dist --declaration
```

#### 依存する側
```ts:packages/lib-b/src/index.ts
import { message } from "lib-a";

console.log(`${message} from lib-b`)
```

```json:packages/lib-b/package.json
{
  "name": "lib-b",
  "version": "0.0.0",
  "main": "./dist/index.js",
  "scripts": {
    "build": "tsc ./src/index.ts --outDir ./dist --declaration"
  },
  "devDependencies": {
    "typescript": "^5.2.2"
  },
  "dependencies": {
    "lib-a": "*"
  }
}
```

確認
```bash
$ npm run build

> lib-b@0.0.0 build
> tsc ./src/index.ts --outDir ./dist --declaration

$  node ./dist/index.js
HELLO WORLD! from lib-b
```

ここまでで、workspace の設定＆作成は完了。

## TurboRepo
workspace 内のタスクを扱いやすくするための設定を行う。

```bash
$ npm i -D turbo
```

```diff:package.json
{
+  "devDependencies": {
+    "turbo": "^1.10.16"
+  },
```

### 設定ファイル追加
`turbo.json`を追加する。

```json:turbo.json
{
    "$schema": "https://turbo.build/schema.json",
    "pipeline": {}
}
```

#### コマンドの追加

```diff:turbo.json
{
  "$schema": "https://turbo.build/schema.json",
  "pipeline": {
+    "build": { }
  }
}
```

```diff:package.json
{
  "scripts": {
    "prepare": "git config --local core.hooksPath .githooks && echo Changed hooks directory when npm install",
+    "build": "turbo build"
  },
}

```

実行結果

<details><div>

```bash
$ npm run build

> kaminiten@0.0.1 build
> turbo build

• Packages in scope: lib-a, lib-b
• Running build in 2 packages
• Remote caching disabled
lib-a:build: cache miss, executing a95ca7f72440e4f7
lib-b:build: cache miss, executing ff4864de4082656c
lib-b:build:
lib-b:build: > lib-b@0.0.0 build
lib-b:build: > tsc ./src/index.ts --outDir ./dist --declaration
lib-b:build:
lib-a:build:
lib-a:build: > lib-a@0.0.0 build
lib-a:build: > tsc ./src/index.ts --outDir ./dist --declaration
lib-a:build:

 Tasks:    2 successful, 2 total
Cached:    0 cached, 2 total
  Time:    1.214s
```

</div></details>

package内のbuildが2つ実行されるが、順序が考慮されていない。

#### 実行順序の記載

```diff:package.json
{
  "$schema": "https://turbo.build/schema.json",
  "pipeline": {
    "build": { 
+        "dependsOn": ["^build"]
    }
  }
}
```


<details><div>

```bash
$ npm run build

> kaminiten@0.0.1 build
> turbo build

• Packages in scope: lib-a, lib-b
• Running build in 2 packages
• Remote caching disabled
lib-a:build: cache hit (outputs already on disk), replaying logs a95ca7f72440e4f7
lib-a:build:
lib-a:build: > lib-a@0.0.0 build
lib-a:build: > tsc ./src/index.ts --outDir ./dist --declaration
lib-a:build:
lib-b:build: cache miss, executing ae64577917fd6274
lib-b:build: 
lib-b:build: > lib-b@0.0.0 build
lib-b:build: > tsc ./src/index.ts --outDir ./dist --declaration
lib-b:build:

 Tasks:    2 successful, 2 total
Cached:    1 cached, 2 total
  Time:    1.109s
```

</div></details>

順序を考慮したものになった。

## 参考
[pnpm x Turborepo x lerna-lite x GitHub Packagesでmonorepoなオレオレ非公開ライブラリをつくってみる](https://www.memory-lovers.blog/entry/2023/07/05/140000)
[もはや pnpm と Turborepo で Monorepo 環境作れるから](https://zenn.dev/uttk/articles/create-pnpm-monorepo)