Skip to content

SCSS manifest plugin for Vite + Vite-based litmus setup - #1318

Open
mstijak wants to merge 3 commits into
masterfrom
feat/scss-manifest-vite-plugin
Open

SCSS manifest plugin for Vite + Vite-based litmus setup#1318
mstijak wants to merge 3 commits into
masterfrom
feat/scss-manifest-vite-plugin

Conversation

@mstijak

@mstijak mstijak commented Jul 31, 2026

Copy link
Copy Markdown
Member

Summary

Adds cx-scss-manifest-vite-plugin — the Vite counterpart of cx-scss-manifest-webpack-plugin — and converts litmus to optionally run on Vite 8 to prove it out end-to-end.

packages/cx-scss-manifest-vite-plugin

  • Scans import statements of the app's own modules with es-module-lexer in the transform hook, validates candidates against cx/manifest.js, and generates the same manifest.scss format as the webpack plugin (files are interchangeable between the two).
  • Handles named imports (alias-aware), cross-namespace re-exports (e.g. Repeater from cx/widgetsui/Repeater), deep imports, and skips import type statements and node_modules.
  • Dev: debounced writes; Vite tracks manifest.scss as a sass dependency, so new widget styles hot-reload without a page refresh.
  • Build: full-graph scan; warns when the manifest changed during the build (CSS compiled with the previous manifest — rerun to apply).
  • Seeds its entry set from the existing file on startup, so an on-demand dev session never shrinks a manifest produced by a full build. Entries are append-only; reset by deleting entries + running a build.

fix(cx): type-only re-exports

Three type-only names were re-exported as values (AccessorChain in ui/index.ts, JSX in jsx-dev-runtime.ts, GridRowConfig in Grid.tsx). Babel tolerated this, but any isolated-modules transpiler (esbuild/oxc/swc) keeps the import and fails at runtime — this breaks all jsxImportSource: "cx" source-consuming setups, not just litmus. Fixed with export type (verified via tsc --isolatedModules, which now reports no TS1205 errors).

feat(litmus): Vite setup alongside webpack

  • yarn start:vite (port 8090) / yarn build:vite; the webpack workflow is untouched.
  • Aliases cx/* to packages/cx/src — framework source edits hot-reload directly, no compile step.
  • Automatic JSX runtime with jsxImportSource: "cx" (no babel). Legacy .js demos containing JSX go through a small esbuild bridge plugin, since rolldown's built-in transform doesn't allow enabling JSX for .js (its TransformOptions.lang is ignored in the native plugin). The active demo is renamed to .tsx as the migration path — pure oxc handles those.
  • Vite 8 production build: ~0.6s.

Testing

  • Verified in a real browser (dev + production build): widget styles present, chart/switch/select rendered correctly, HMR loop (new import → manifest update → CSS hot update) works without page reload.
  • yarn check-types clean; yarn test — 535 passing, 1 pre-existing failure on master (babel-plugin-transform-cx-imports vs. stale dist/manifest.js after the cx/widgets barrel refactor, unrelated to this PR).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant