Morphos & Kosmesis are here.Explore
PraxisJS

@praxisjs/vite-plugin

Changelog for @praxisjs/vite-plugin — Vite integration with JSX transform and HMR support.

@praxisjs/vite-plugin

4.0.3

Fixed decoratorLoweringPlugin() (used internally by praxisjs(), and by @praxisjs/storybook's Vite config) silently dropping decorated class fields that have no initializer, e.g. @Styled(BadgeStyles) $s!: BadgeStyles; or @Ref<HTMLElement>() containerRef!: Ref<HTMLElement>;. The plugin ran in Vite's default "normal" transform tier, after Vite's built-in esbuild TypeScript transform had already parsed the file — esbuild's TC39 decorator support drops such fields entirely instead of lowering them, so the field and its decorator were already gone by the time decoratorLoweringPlugin ran. At runtime the field read back as undefined, and since neither render() nor onMount() swallowed the resulting error, the component silently rendered nothing. decoratorLoweringPlugin() now sets enforce: "pre", running before Vite's esbuild transform ever sees the file.

4.0.2

Fixed praxisjsCSS() build-time extraction treating tsconfig path aliases (e.g. @/components/..., mapped via compilerOptions.paths) as external npm packages. The extraction sandbox resolved these to an empty stub instead of the real local file, so any Stylesheet that imported values through an alias — most commonly a shared design-token module — could end up with undefined values or a throwing constructor, silently dropping that component's CSS from the production build. Aliased imports are now resolved through esbuild's own tsconfig-aware resolver instead of being externalized.

4.0.1

Fixed Cannot find package 'esbuild' errors in scaffolded projects (create-praxisjs) and other consumers. esbuild moved from devDependencies to dependencies — it's imported at runtime by the CSS static-extraction step, so it needs to be installed alongside the plugin itself, not just present in this monorepo's workspace.

4.0.0

Upgraded to Vite 8 (rolldown-vite). Vite 8's oxc-based transform doesn't lower TC39 (non-legacy) decorators yet (oxc-project/oxc#9170), so praxisjs() now uses the TypeScript compiler (ts.transpileModule) to lower decorator syntax into runtime-executable code, leaving JSX untouched for oxc's own JSX pipeline. No third-party decorator transform is bundled — TypeScript's decorator lowering keeps class fields as native ES2022 fields, so a decorated field's addInitializer callback already runs after super() in a derived class's explicit constructor without any extra fix-up pass.

The esbuild config key (deprecated in Vite 8) was replaced with oxc in the plugin's own config() hook.

typescript moved from a devDependency to a regular dependency, since the decorator-lowering pass now calls it at runtime — it's pulled in automatically, no action needed.

Breaking: requires Vite ^8.0.0. Apps still on Vite 7 should stay on the previous major version.

Also requires useDefineForClassFields: true in tsconfig.json (previously false) — see the Getting Started guide. With false, oxc silently drops a class field's decorator during its own TypeScript stripping, before the lowering step ever sees it.

decoratorLoweringPlugin() is now exported alongside praxisjs(), so it can be registered directly in vitest.config.ts (or any other Vite-based tool) to lower decorator syntax outside of the full praxisjs() plugin — see Using decorators in Vitest.

0.2.0

praxisjsCSS() — static CSS extraction plugin for @praxisjs/css.

Scans TypeScript source files for Stylesheet subclasses, keyframes(), globalStyle(), and @Themed() decorators, evaluates them in a sandboxed Node.js context, and emits all CSS into virtual:praxisjs/styles.css. In production, __PRAXIS_CSS_STATIC__ is set to true and runtime <style> injection becomes a no-op. In development, the virtual module is empty and CSS is injected at runtime as usual.

// vite.config.ts
import { praxisjs, praxisjsCSS } from '@praxisjs/vite-plugin'

export default defineConfig({
  plugins: [praxisjs(), praxisjsCSS()],
})

@praxisjs/css is now a peer dependency.

0.1.1

Refreshed workspace dependencies for stability and security (@types/node, eslint, unocss).

0.1.0

Initial release — Vite plugin that configures TypeScript decorators (esbuild target: 'ES2022'), the @praxisjs/jsx import source, and optional component-level HMR.

On this page