
TSDOWN
FreeFast bundling for TypeScript and JavaScript libraries.
Free · Opens the source repo
What TSDOWN does
tsdown is a powerful bundler designed for TypeScript and JavaScript libraries, leveraging the speed of Rolldown and Oxc. It simplifies the process of building libraries for npm, allowing developers to generate type declarations and bundle outputs in various formats such as ESM, CJS, IIFE, and UMD. With its focus on performance, tsdown supports advanced features like tree shaking and minification, ensuring that the final output is optimized for distribution.
The tool is particularly useful for developers migrating from tsup, as it offers a straightforward transition with minimal changes required to existing configurations. tsdown also provides a comprehensive configuration system, allowing users to specify entry points, output formats, and additional options such as source maps and dependency handling. This flexibility makes it suitable for a wide range of use cases, including building component libraries for frameworks like React, Vue, Solid, and Svelte.
To get started, users can easily install tsdown via npm and execute basic commands to bundle their projects. The tool also supports a watch mode for continuous development, making it easy to see changes in real-time. For more complex requirements, tsdown offers a programmatic API and lifecycle hooks, enabling deeper customization and integration into larger workflows.
Overall, tsdown is an excellent choice for developers looking to streamline their library bundling process while maintaining high performance and flexibility.
When to use it
Use `tsdown` when building libraries for npm, especially if you require support for multiple output formats or are migrating from `tsup`.
When not to use it
This tool may not be suitable for non-library projects or for developers who do not require advanced bundling features.
What you can build with it
Building a React Library
Use `tsdown` to bundle a React component library, ensuring optimized output for both ESM and CJS formats.
Migrating from tsup
Transition your existing project from `tsup` to `tsdown` using the provided migration guide for a seamless experience.
Generating Type Declarations
Leverage `tsdown` to automatically generate TypeScript declaration files for your library, enhancing type safety for users.
How to install TSDOWN
View source1. Install with the skills CLI
npx skills add rolldown/tsdown/tsdown --agent claude-code2. Or install it manually
Download the skill folder and drop it into ~/.claude/skills/ for all projects, or .claude/skills/ to scope it to one repo. Restart Claude Code so it picks up the new skill.
Anthropic's agentic coding CLI, and the reference implementation of Agent Skills. Drop a skill folder into ~/.claude/skills and Claude Code loads it automatically whenever a task matches the skill's description. Claude Code docs
Inside SKILL.md
Written by rolldowntsdown - The Elegant Library Bundler
Blazing-fast bundler for TypeScript/JavaScript libraries powered by Rolldown and Oxc.
Runtime Requirement
tsdown requires Node.js 22.18.0 or higher to run (build-time only). However, the bundled output can target much lower Node.js versions via the target option, so libraries built with tsdown are not locked to Node.js 22+ at runtime.
If your package needs to support Node.js 18 / 20:
- Build with Node.js 22+ in CI (e.g. set
target: 'node18'ortarget: 'node20'). - Test the built output (or the packed tarball) on the lower Node.js versions you intend to support — e.g. using a matrix job that runs the published package's tests on Node.js 18 / 20 / 22.
When to Use
- Building TypeScript/JavaScript libraries for npm
- Generating TypeScript declaration files (.d.ts)
- Bundling for multiple formats (ESM, CJS, IIFE, UMD)
- Optimizing bundles with tree shaking and minification
- Migrating from tsup with minimal changes
- Building React, Vue, Solid, or Svelte component libraries
Quick Start
# Install
pnpm add -D tsdown
# Basic usage
npx tsdown
# With config file
npx tsdown --config tsdown.config.ts
# Watch mode
npx tsdown --watch
# Migrate from tsup
npx tsdown-migrate
Basic Configuration
import { defineConfig } from 'tsdown'
export default defineConfig({
entry: ['./src/index.ts'],
format: ['esm', 'cjs'],
dts: true,
clean: true,
})
Core References
| Topic | Description | Reference |
|---|---|---|
| Getting Started | Installation, first bundle, CLI basics | guide-getting-started |
| Configuration File | Config file formats, multiple configs, workspace | option-config-file |
| CLI Reference | All CLI commands and options | reference-cli |
| Migrate from tsup | Migration guide and compatibility notes | guide-migrate-from-tsup |
| Plugins | Rolldown, Rollup, Unplugin support | advanced-plugins |
| Hooks | Lifecycle hooks for custom logic | advanced-hooks |
| Programmatic API | Build from Node.js scripts, in-memory builds (write: false) | advanced-programmatic |
| Rolldown Options | Pass options directly to Rolldown | advanced-rolldown-options |
| CI Environment | CI detection, 'ci-only' / 'local-only' values | advanced-ci |
For comprehensive migration assistance with complete option mappings, install the dedicated
tsdown-migrateskill:npx skills add rolldown/tsdown --skill tsdown-migrate
Build Options
| Option | Usage | Reference |
|---|---|---|
| Entry points | entry: ['src/*.ts', '!**/*.test.ts'] | option-entry |
| Output formats | format: ['esm', 'cjs', 'iife', 'umd'] | option-output-format |
| Output directory | outDir: 'dist', outExtensions | option-output-directory |
| Type declarations | dts: true, dts: { sourcemap, compilerOptions, vue } | option-dts |
| Target environment | target: 'es2020', target: 'esnext' | option-target |
| Platform | platform: 'node', platform: 'browser' | option-platform |
| Tree shaking | treeshake: true, custom options | option-tree-shaking |
| Minification | minify: true, minify: 'dce-only' | option-minification |
| Source maps | sourcemap: true, 'inline', 'hidden' | option-sourcemap |
| Watch mode | watch: true, watch options | option-watch-mode |
| Cleaning | clean: true, clean patterns | option-cleaning |
| Log level | logLevel: 'silent', failOnWarn: false, suppressWarnings: [...] | option-log-level |
Dependency Handling
| Feature | Usage | Reference |
|---|---|---|
| Never bundle | deps: { neverBundle: ['react', /^@myorg\//] } | option-dependencies |
| Always bundle | deps: { alwaysBundle: ['dep-to-bundle'] } | option-dependencies |
| Only bundle | deps: { onlyBundle: ['cac', 'bumpp'] } - Whitelist | option-dependencies |
| Only import | deps: { onlyImport: ['cac'] } - Whitelist runtime imports in output | option-dependencies |
| Externalize all | deps: { neverBundle: true } | option-dependencies |
| Resolve subpaths | deps: { resolveDepSubpath: true } - Resolve external subpath imports (default false) | option-dependencies |
| Auto external | Automatic dependency/peer/optional externalization | option-dependencies |
Output Enhancement
| Feature | Usage | Reference |
|---|---|---|
| Shims | shims: true - Add ESM/CJS compatibility | option-shims |
| CJS default | cjsDefault: true (default) / false | option-cjs-default |
| Package exports | exports: true - Generate exports field | option-package-exports |
| CSS handling | [experimental] css: { ... } — full pipeline with preprocessors, Lightning CSS, PostCSS, CSS modules, code splitting; requires @tsdown/css | option-css |
| CSS modules | css: { modules: { localsConvention: 'camelCase' } } — scoped class names for .module.css files | option-css |
| CSS inject | css: { inject: true } — preserve CSS imports in JS output | option-css |
| Copy files | copy: 'public' or copy: { from, to, flatten, rename } - Copy static assets to output | option-copy |
| Unbundle mode | unbundle: true - Preserve directory structure | option-unbundle |
| Root directory | root: 'src' - Control output directory mapping | option-root |
| Executable | [experimental] exe: true - Bundle as standalone executable, cross-platform via @tsdown/exe | option-exe |
| Package validation | publint: true, attw: true - Validate package | option-lint |
Framework & Runtime Support
| Framework | Guide | Reference |
|---|---|---|
| React | JSX transform, React Compiler | recipe-react |
| Vue | SFC support, JSX | recipe-vue |
| Solid | SolidJS JSX transform | recipe-solid |
| Svelte | Svelte component libraries (source distribution recommended) | recipe-svelte |
| WASM | WebAssembly modules via rolldown-plugin-wasm | recipe-wasm |
Common Patterns
Basic Library Bundle
export default defineConfig({
entry: ['src/index.ts'],
format: ['esm', 'cjs'],
dts: true,
clean: true,
})
Multiple Entry Points
export default defineConfig({
entry: {
index: 'src/index.ts',
utils: 'src/utils.ts',
cli: 'src/cli.ts',
},
format: ['esm', 'cjs'],
dts: true,
})
Browser Library (IIFE/UMD)
export default defineConfig({
entry: ['src/index.ts'],
format: ['iife'],
globalName: 'MyLib',
platform: 'browser',
minify: true,
})
React Component Library
export default defineConfig({
entry: ['src/index.tsx'],
format: ['esm', 'cjs'],
dts: true,
deps: {
neverBundle: ['react', 'react-dom'],
},
inputOptions: {
jsx: { runtime: 'automatic' },
},
})
Preserve Directory Structure
export default defineConfig({
entry: ['src/**/*.ts', '!**/*.test.ts'],
unbundle: true, // Preserve file structure
format: ['esm'],
dts: true,
})
CI-Aware Configuration
export default defineConfig({
entry: ['src/index.ts'],
format: ['esm', 'cjs'],
dts: true,
failOnWarn: 'ci-only', // opt-in: fail on warnings in CI
publint: 'ci-only',
attw: 'ci-only',
})
WASM Support
import { wasm } from 'rolldown-plugin-wasm'
import { defineConfig } from 'tsdown'
export default defineConfig({
entry: ['src/index.ts'],
plugins: [wasm()],
})
Library with CSS and Sass
export default defineConfig({
entry: ['src/index.ts'],
format: ['esm', 'cjs'],
dts: true,
target: 'chrome100',
css: {
preprocessorOptions: {
scss: {
additionalData: `@use "src/styles/variables" as *;`,
},
},
},
})
Standalone Executable
export default defineConfig({
entry: ['src/cli.ts'],
exe: true,
})
Cross-Platform Executable (requires @tsdown/exe)
export default defineConfig({
entry: ['src/cli.ts'],
exe: {
targets: [
{ platform: 'linux', arch: 'x64', nodeVersion: '25.7.0' },
{ platform: 'darwin', arch: 'arm64', nodeVersion: '25.7.0' },
{ platform: 'win', arch: 'x64', nodeVersion: '25.7.0' },
],
},
})
Advanced with Hooks
export default defineConfig({
entry: ['src/index.ts'],
format: ['esm', 'cjs'],
dts: true,
hooks: {
'build:before': async (context) => {
console.log('Building...')
},
'build:done': async (context) => {
console.log('Build complete!')
},
},
})
Configuration Features
Multiple Configs
Export an array for multiple build configurations:
export default defineConfig([
{
entry: ['src/index.ts'],
format: ['esm', 'cjs'],
dts: true,
},
{
entry: ['src/cli.ts'],
format: ['esm'],
platform: 'node',
},
])
Conditional Config
Use functions for dynamic configuration:
export default defineConfig((options) => {
const isDev = options.watch
return {
entry: ['src/index.ts'],
format: ['esm', 'cjs'],
minify: !isDev,
sourcemap: isDev,
}
})
Workspace/Monorepo
Use glob patterns to build multiple packages:
export default defineConfig({
workspace: 'packages/*',
entry: ['src/index.ts'],
format: ['esm', 'cjs'],
dts: true,
})
CLI Quick Reference
# Basic commands
tsdown # Build once
tsdown --watch # Watch mode
tsdown --config custom.ts # Custom config
npx tsdown-migrate # Migrate from tsup
# Output options
tsdown --format esm,cjs # Multiple formats
tsdown -d lib # Custom output directory (--out-dir)
tsdown --minify # Enable minification
tsdown --dts # Generate declarations
tsdown --exe # Bundle as standalone executable
tsdown --unbundle # Bundleless mode
tsdown --copy public # Copy static files to output
# Entry options
tsdown src/index.ts # Single entry
tsdown src/*.ts # Glob patterns
tsdown src/a.ts src/b.ts # Multiple entries
# Workspace / Monorepo
tsdown -W # Enable workspace mode
tsdown -W -F my-package # Filter specific package
tsdown --filter /^pkg-/ # Filter by regex
tsdown -W --concurrency 4 # Limit parallel Rolldown builds
# Development
tsdown --watch # Watch mode
tsdown --sourcemap # Generate source maps
tsdown --clean # Clean output directory
tsdown --from-vite # Reuse Vite config
tsdown --tsconfig tsconfig.build.json # Custom tsconfig
Best Practices
-
Always generate type declarations for TypeScript libraries:
{ dts: true } -
Externalize dependencies to avoid bundling unnecessary code:
{ deps: { neverBundle: [/^react/, /^@myorg\//] } } -
Use tree shaking for optimal bundle size:
{ treeshake: true } -
Enable minification for production builds:
{ minify: true } -
Add shims for better ESM/CJS compatibility:
{ shims: true } // Adds __dirname, __filename, etc. -
Auto-generate package.json exports:
{ exports: true } // Creates proper exports field -
Use watch mode during development:
tsdown --watch -
Preserve structure for utilities with many files:
{ unbundle: true } // Keep directory structure -
Validate packages in CI before publishing:
{ publint: 'ci-only', attw: 'ci-only' }
Resources
- Documentation: https://tsdown.dev
- GitHub: https://github.com/rolldown/tsdown
- Rolldown: https://rolldown.rs
- Migration Guide: https://tsdown.dev/guide/migrate-from-tsup
Frequently asked questions about TSDOWN
Similar skills
Rhino 3D Scripting
Streamline your Rhinoceros 3D scripting tasks.
MVVM Toolkit
Streamline ViewModel development with source generators.
FreeCAD Scripts
Generate Python scripts for FreeCAD automation and modeling.
Azure Architecture Builder
Design and deploy Azure infrastructure using natural language.
Command Development
Streamline your command creation for Claude Code.
Create Cowork Plugin
Easily build and package plugins through guided sessions.
