Open5

bunでワークスペース

amttamtt

shared/

➜ tree                                
.
├── package.json
├── src
│   ├── constants
│   ├── index.ts
│   ├── rpc.ts
│   ├── schemas
│   │   ├── post.ts
│   │   └── thread.ts
│   ├── types
│   └── utils
└── tsconfig.json

6 directories, 6 files

bunx tsc --initする

package.json
{
    "name": "@b3s/shared",
    "version": "1.0.0",
    "main": "src/index.ts",
    "types": "src/index.ts",
    "dependencies": {
        "zod": "^4.1.5"
    }
}

maintypesにdistは含めない
モノレポのパッケージとして使っているので.tsを指定

frontend/backend/に移動して、bun add "@b3s/shared@workspace:*"でパッケージをインストール

amttamtt

ルートのpackage.jsonに下記を追加して、ワークスペース化し、モノレポとして使う

package.json
	"workspaces": [
		"packages/*"
	],
amttamtt

sharedに含めるもの
スキーマの型、汎用util、共用のconstance、共用のtypesなど

amttamtt

next.config.tsに追加

next.config.ts
import type { NextConfig } from "next";

const nextConfig: NextConfig = {
    transpilePackages: ["@b3s/shared"], 
    experimental: {
        externalDir: true
    }
};

export default nextConfig;

// added by create cloudflare to enable calling `getCloudflareContext()` in `next dev`
import { initOpenNextCloudflareForDev } from "@opennextjs/cloudflare";
initOpenNextCloudflareForDev();

フロントでshared( : モノレポのパッケージとして)をインストールするときに必要なやつ
普通はパッケージをbuildしてdist/配下に.jsを出力し、それをmainに扱うけど、今回のモノレポの場合、.tsをmainの出力としており、Next側(Nextに限った話ではないけど、)は.jsじゃないと読み込めないので、インポート前にswcでsharedパッケージをビルドするってやつ

amttamtt

shared/に含めるべきはzod依存のシンプルなスキーマで、zod-openapiを使うべきではない
バックエンド側で@b3s/sharedのシンプルなスキーマをインポートし、それにopenapiのexampleやdescriptionなどを付け加える設計が良いらしい