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の設定。
{
"extends": "./tsconfig.json",
"include": [
"app/validators/**/*.ts"
],
"compilerOptions": {
"noEmit": false,
"outDir": "app/generated",
"rootDir": "."
},
}
tsconfig.jsonはプロジェクトの設定。
includeでTypiaのコードのみビルドする。
noEmit:falseでビルドした内容を出力。
outDirで出力先。
以下はVite設定。
// 〜略〜
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のコード
import type { ApiData } from "app/types/apidata"
export const parseApi =
typia.json.createIsParse<ApiData[]>()
はapp/validators下に配置する。
使用時
import { parseApi } from "~/validators/api"
importパスは開発時、本番時、自動的に切り替わるようViteの設定をする。
app/validators下や関連のファイルを変更した時、再度、
bunx ttsc --project tsconfig.build.json