@typia/unplugin

Why

Bundler plugin for Typia

Typia is fantastic, but it can be hard to set up, especially for frontend development.

If you use bundlers like Vite, it can be even harder to configure.

This unplugin aims to make it easier to use Typia in your projects.

Install

First, install typia and set it up:

# npm
npm install typia
npx typia setup

# pnpm
pnpm install typia
pnpm typia setup --manager pnpm

# yarn (yarn berry is not supported)
yarn add typia
yarn typia setup --manager yarn

# bun
bun add typia
bun typia setup

Then, install @typia/unplugin:

# npm
npm install -D @typia/unplugin

# pnpm
pnpm install -D @typia/unplugin

# yarn
yarn add -D @typia/unplugin

# bun
bun add -D @typia/unplugin

More details about setting up Typia can be found in the Typia Docs.

Then, add the unplugin to your favorite bundler:

// vite.config.ts
import UnpluginTypia from '@typia/unplugin/vite';

export default defineConfig({
  plugins: [
    UnpluginTypia({ /* options */ }), // should be placed before other plugins like `react`, `svelte`, etc.
  ],
});

When using typia with types imported from non-relative paths like tsconfig compilerOptions.paths or relative to tsconfig compilerOptions.baseUrl, they must be defined in vite.config.ts under resolve.alias in order to be resolved, according to vite's resolution mechanism.

// esbuild.config.js
import UnpluginTypia from '@typia/unplugin/esbuild';

export default {
  plugins: [
    UnpluginTypia({ /* options */ }),
  ],
};

// next.config.mjs
import unTypiaNext from '@typia/unplugin/next';

/** @type {import('next').NextConfig} */
const nextConfig = { /* your next.js config */};

/** @type {import("@typia/unplugin").Options} */
const unpluginTypiaOptions = { /* your @typia/unplugin options */ };

export default unTypiaNext(nextConfig, unpluginTypiaOptions);

// you can omit the @typia/unplugin options when you don't need to customize it
// export default unTypiaNext(nextConfig);

Example 1: Using for building script

// build.ts
import UnpluginTypia from '@typia/unplugin/bun';

await Bun.build({
  entrypoints: ['./index.ts'],
  outdir: './out',
  plugins: [
    UnpluginTypia({ /* your options */})
  ]
});

For building the script:

bun run ./build.ts
node ./out/index.js

Check the Plugins – Bundler | Bun Docs for more details.

Example 2: Using for running script

// preload.ts
import { plugin } from 'bun';
import UnpluginTypia from '@typia/unplugin/bun';

plugin(UnpluginTypia({ /* your options */}));

# bunfig.toml
preload = ["./preload.ts"]

[test]
preload = ["./preload.ts"]

For running the script:

bun run ./index.ts

Check the Plugins – Runtime | Bun Docs for more details.

// rollup.config.js
import UnpluginTypia from '@typia/unplugin/rollup';

export default {
  plugins: [
    UnpluginTypia({ /* options */ }),
  ],
};

// rolldown.config.js
import UnpluginTypia from '@typia/unplugin/rolldown';

export default {
  plugins: [
    UnpluginTypia({ /* options */ }),
  ],
};

// webpack.config.js

const { default: UnpluginTypia } = require('@typia/unplugin/webpack');

module.exports = {
  plugins: [
    UnpluginTypia({ /* options */ }),
  ],
};

// rspack.config.js

const { default: UnpluginTypia } = require('@typia/unplugin/rspack');

module.exports = {
  plugins: [
    UnpluginTypia({ /* options */ }),
  ],
};

// farm.config.ts
import UnpluginTypia from '@typia/unplugin/farm';

export default {
  plugins: [
    UnpluginTypia({ /* options */ }),
  ],
};

Supported Bundlers

• Bun
• esbuild
• Farm
• Next.js
• Rolldown
• Rollup
• Rspack
• Vite
• Webpack

Supported File Extensions

• .ts
• .tsx
• .mts
• .mtsx
• .svelte (only script tag with lang="ts")

Acknowledgements

This project was originally created by @ryoppippi as @ryoppippi/unplugin-typia.

Now it has been integrated into the official Typia repository as @typia/unplugin.