dequelabs / dequelabs/cauldron
chore(react): migrate library build from Rollup to Vite (lib mode)
- Dominant language
- TypeScript
- Stars
- 127
- Forks
- 31
- Avg merge
- 2d 12h
- Merged PRs (30d)
- 8
Description
## Summary
Replace the Rollup-based build of `@deque/cauldron-react` with Vite's library mode. `packages/react` is the only package that would change — `packages/styles` (postcss-cli), the docs site (webpack), and Playwright CT (already on Vite) stay as-is.
The migration must preserve the published contract:
- `main: lib/index.js` (CJS), `types: lib/index.d.ts`, `style: lib/cauldron.css`
- Code-split chunks for the icon SVGs (driven by `` import(`./icons/${iconName}.svg`) `` in `packages/react/src/components/Icon/index.tsx`)
- Externals: `dependencies` + `peerDependencies` + `/^react-syntax-highlighter/`
- SVGR svgo config: `removeViewBox: false`, `removeDimensions`, force `width=24`/`height=24`
- `process.env.NODE_ENV` left as a runtime reference (Icon's test-mode guard depends on it)
## Proposed approach
- Add `packages/react/vite.config.ts` using `build.lib` + `@vitejs/plugin-react` + `vite-plugin-svgr` + `vite-plugin-dts`
- Swap `devDependencies`: drop `rollup`, `@rollup/plugin-typescript`, `@rollup/plugin-commonjs`, `@rollup/plugin-dynamic-import-vars`, `@svgr/rollup`; add `vite`, `@vitejs/plugin-react`, `vite-plugin-svgr`, `vite-plugin-dts`
- Update scripts: `build:lib` → `vite build`, `dev` → `vite build --watch` (CSS step unchanged)
- Delete `packages/react/rollup.config.js` after parity is verified
- Out of scope: Jest setup, `.babelrc`, `postcss.config.js`, the docs-site webpack config
## Migration risks
1. Icon dynamic imports — Vite ships `@rollup/plugin-dynamic-import-vars` internally; verify per-icon chunks are still emitted
2. SVGR output parity (both plugins wrap `@svgr/core`; spot-check one icon)
3. `process.env.NODE_ENV` must not be inlined in the lib build
4. `.d.ts` emission via `vite-plugin-dts` instead of `@rollup/plugin-typescript`
5. The `/^react-syntax-highlighter/` external regex must be preserved exactly
## Verification plan
- [ ] `yarn --cwd=packages/react build` produces `lib/` with parity to the previous Rollup output (`diff -r` the trees; bundle size within ~5%)
- [ ] `lib/` still contains `process.env.NODE_ENV` as a runtime reference
- [ ] `lib/index.d.ts` and per-component `.d.ts` files are present and type-check
- [ ] Docs site (`yarn dev` from repo root) renders icons correctly against the new `lib/`
- [ ] `yarn --cwd=packages/react test` passes (tests don't go through the bundler, so should be unaffected)
- [ ] Playwright CT screenshots (`yarn screenshots`) catch no visual regressions
- [ ] `npm pack --dry-run` in `packages/react` matches today's published file list
Contributor guide
Assessment
This issue has not been assessed yet.