TypiaをViteで使っている。ドキュメント通り、@ttsc/unpluginでビルドすると、コードの更新の度に再ビルドされるため、長く待たされる。
本番時は問題ないが、開発時では待たされて困るので、ひとまず事前にビルドをしたものをインポートしてこの問題を解決する。

以前、Typiaに存在していた、typia generateと同じことをする。
事前にビルドしたデータはapp/generatedに保存する。

ここではTypiaのコードは、app/validatorsに配置する。
Typiaのコードを開発時はapp/generated/validatorsからimportする。
本番時は@ttsc/unplugin/viteを使うためapp/validatorsからimportする。
それをViteのAliasで自動的に変える。

Typiaをビルドして変換するには、

bunx ttsc --project tsconfig.build.json

以下はttscに読み込ませるTSの設定。

tsconfig.build.json

{
  "extends": "./tsconfig.json",
  "include": [
    "app/validators/**/*.ts"
  ],

  "compilerOptions": {
    "noEmit": false,
    "outDir": "app/generated",
    "rootDir": "."
  },
}

tsconfig.jsonはプロジェクトの設定。
includeでTypiaのコードのみビルドする。
noEmit:falseでビルドした内容を出力。
outDirで出力先。

以下はVite設定。

vite.config.ts

// 〜略〜
import ttsc from "@ttsc/unplugin/vite";
import path from "node:path";

export default defineConfig(({ mode }) => {
  const isDev = mode === "development";

  return {
    // 略
  
    resolve: {
      alias: {
        "~/validators": isDev
          ? path.resolve(import.meta.dirname, "dist/generated/app/validators")
          : path.resolve(import.meta.dirname, "app/validators"), 
      },
    },

    plugins: [
      ...(isDev ? [] : [
        ttsc(),
      ]),
  }
});

本番時のみ@ttsc/unplugin/viteを使う。
aliasを使い、開発時と本番時のimport元を変える。

Typiaのコード

app/validators/api.ts

import type { ApiData } from "app/types/apidata"

export const parseApi =
    typia.json.createIsParse<ApiData[]>()

はapp/validators下に配置する。

使用時

app/lib/api/fetch.ts

import { parseApi } from "~/validators/api"

importパスは開発時、本番時、自動的に切り替わるようViteの設定をする。

app/validators下や関連のファイルを変更した時、再度、

bunx ttsc --project tsconfig.build.json