Replace microbundle with tsdown#231
Draft
omgovich wants to merge 3 commits into
Draft
Conversation
microbundle has been stagnant for years. tsup (esbuild-based) is actively maintained, faster, and produces equivalent output. - Add tsup.config.ts with esbuild plugin that minifies and inlines CSS as a string (replaces microbundle's --css inline flag) - Rename styles.css to styles.pcss to bypass tsup's built-in CSS extraction - Simplify package.json exports (drop UMD, esmodule, source fields) - Remove postbuild copy step (tsup emits .mjs natively) - Upgrade size-limit to v12 (v4 incompatible with Node 22) - Remove microbundle, cpy-cli, parcel-plugin-css-to-string
|
Size Change: 0 B 🆕 Total Size: 0 B |
There was a problem hiding this comment.
Pull request overview
Replaces the library bundler from microbundle to tsup (esbuild-based), preserving inline/minified stylesheet behavior while simplifying published outputs and build tooling.
Changes:
- Added
tsup.config.tswith a custom esbuild plugin to inline/minify.pcssas a JS string export. - Switched runtime stylesheet import to
styles.pcssand added a corresponding TS declaration file. - Updated
package.jsonbuild script/exports and upgradedsize-limit(plus related dependency cleanup).
Reviewed changes
Copilot reviewed 5 out of 8 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| tsup.config.ts | Introduces tsup build configuration and custom .pcss inlining/minification plugin. |
| src/hooks/useStyleSheet.ts | Updates stylesheet import to the new .pcss entry. |
| src/css/styles.pcss.d.ts | Adds a type declaration for importing the .pcss file in TS. |
| src/css/styles.pcss | Adds the inlined/minified source stylesheet content under .pcss. |
| package.json | Switches build tooling to tsup, updates exports/size-limit paths, removes microbundle-era fields/deps. |
| CLAUDE.md | Updates build documentation to reflect tsup + custom .pcss inlining approach. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Comment on lines
+1
to
+3
| import { defineConfig } from "tsup"; | ||
| import { readFileSync } from "fs"; | ||
| import { transform } from "esbuild"; |
Comment on lines
+5
to
+12
| export default defineConfig({ | ||
| entry: ["src/index.ts"], | ||
| format: ["cjs", "esm"], | ||
| dts: true, | ||
| sourcemap: true, | ||
| clean: true, | ||
| external: ["react", "react-dom"], | ||
| target: "es2018", |
- Replace tsup with tsdown (rolldown-based bundler) - Use rolldown plugin with base64-encoded IDs to bypass tsdown's css-guard and inline CSS as minified strings - Restore original .css file extension (undo .pcss workaround) - Fix jest mock pattern for .css imports - Use explicit `export type` for type-only re-exports (rolldown strict) - Upgrade size-limit to v12 with gzip measurement - Raise size limits by ~0.2 KB to account for toolchain change - Update CLAUDE.md build documentation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
.cssfiles and exports them as minified string constants — functionally identical to microbundle's--css inlinepackage.json: dropped UMD output, removedesmodule/source/umd:mainfields, cleaned up exports mappostbuildcopy step — tsdown emits.mjs/.cjsnativelysize-limitfrom v4 to v12 (v4 incompatible with Node.js 22), switched to gzip measurementexport typefor type-only re-exports (rolldown is stricter than microbundle about this)Breaking changes
dist/index.umd.js) is no longer produced. UMD is irrelevant for a React component library since React itself must already be loaded. jsdelivr CDN data showed only ~22K total requests across all time — negligible.react-colorful/dist/components/...no longer resolve (these were never part of the public API)Size comparison
All pickers remain within budget (gzip):
Test plan
npm run build— producesindex.cjs,index.mjs,index.d.cts,index.d.mts, source mapsnpm run size— all 14 pickers + input pass size-limit budgets (gzip)npm test— 63/63 tests passnpm run check-types— pre-existing goober/csstype error only (not related)