0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

開発時 @ttsc/unpluginを使うと重い(Typia)

0
Last updated at Posted at 2026-08-28

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
0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?