{"id":26655,"library":"what-compiler","title":"what-compiler","description":"JSX compiler for What Framework. Transforms JSX into optimized DOM operations via a Babel plugin or Vite plugin. Current stable version is 0.8.1. Development is active with frequent releases. Key differentiators: file-based routing via virtual module, production optimizations, and significant performance improvements (e.g., DOM rendering pipeline optimizations). Compared to other JSX compilers like babel-plugin-transform-react-jsx, it is tightly integrated with What Framework and provides virtual routing.","status":"active","version":"0.8.1","language":"javascript","source_language":"en","source_url":"https://github.com/CelsianJs/what-framework","tags":["javascript","what","framework","compiler","jsx","babel","vite"],"install":[{"cmd":"npm install what-compiler","lang":"bash","label":"npm"},{"cmd":"yarn add what-compiler","lang":"bash","label":"yarn"},{"cmd":"pnpm add what-compiler","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency required for Babel plugin.","package":"@babel/core","optional":false},{"reason":"Peer dependency required for runtime helpers.","package":"what-core","optional":false}],"imports":[{"note":"The Vite plugin is exported as a named export (what or vitePlugin). Default import is not available.","wrong":"import what from 'what-compiler/vite'","symbol":"vitePlugin|what","correct":"import { what } from 'what-compiler/vite'"},{"note":"Babel plugin is a named export.","wrong":"import babelPlugin from 'what-compiler/babel'","symbol":"babelPlugin","correct":"import { babelPlugin } from 'what-compiler/babel'"},{"note":"Routes are generated at build time from a virtual module, not from the package itself.","wrong":"import routes from 'what-compiler/virtual-routes'","symbol":"routes","correct":"import { routes } from 'virtual:what-routes'"},{"note":"Package is ESM-only, CommonJS require() will fail.","wrong":"const scanPages = require('what-compiler/file-router').scanPages","symbol":"scanPages","correct":"import { scanPages } from 'what-compiler/file-router'"}],"quickstart":{"code":"// vite.config.js\nimport { defineConfig } from 'vite';\nimport { what } from 'what-compiler/vite';\n\nexport default defineConfig({\n  plugins: [\n    what({\n      pages: './src/pages',\n      production: process.env.NODE_ENV === 'production',\n    }),\n  ],\n});\n\n// src/App.jsx\nimport { mount } from 'what-framework';\nimport { routes } from 'virtual:what-routes';\nimport { FileRouter } from 'what-router';\n\nconst App = () => <FileRouter routes={routes} />;\n\nmount(<App />, document.getElementById('app'));","lang":"javascript","description":"Configures Vite plugin with file-based routing, then mounts app with routes."},"warnings":[{"fix":"Ensure custom rendering extensions are updated to work with the new pipeline.","message":"v0.7.0 changed internal DOM rendering pipeline, may affect custom rendering logic.","severity":"breaking","affected_versions":"<0.7.0"},{"fix":"Use 'what-compiler/file-router' for file router helpers.","message":"Deprecated 'what-compiler/runtime' subpath removed in v0.6.0.","severity":"deprecated","affected_versions":">=0.6.0"},{"fix":"Use import syntax; if using CommonJS, use dynamic import() or set package type to module.","message":"ESM-only package: require() does not work.","severity":"gotcha","affected_versions":">=0.8.0"},{"fix":"Only import routes inside Vite-processed code; do not import in Node scripts outside Vite.","message":"Virtual module 'virtual:what-routes' only exists after Vite build/start; cannot be imported directly in Node.js.","severity":"gotcha","affected_versions":">=0.8.0"}],"env_vars":null,"last_verified":"2026-05-01T00:00:00.000Z","next_check":"2026-07-30T00:00:00.000Z","problems":[{"fix":"Ensure the import is only used in code processed by Vite (e.g., inside src/).","cause":"Importing virtual module outside of Vite environment (e.g., in Node script without Vite).","error":"Cannot find module 'virtual:what-routes'"},{"fix":"Run 'npm install what-compiler --save-dev' and verify the import path 'what-compiler/vite' (not 'what-compiler/vite-plugin').","cause":"Package not installed or incorrect subpath.","error":"Module not found: Error: Can't resolve 'what-compiler/vite' in '/project/vite.config.js'"},{"fix":"Use import { what } from 'what-compiler/vite'.","cause":"Default import used instead of named import for Vite plugin.","error":"TypeError: what is not a function"},{"fix":"Use import { babelPlugin } from 'what-compiler/babel'.","cause":"Using default import for Babel plugin instead of named export.","error":"Error: [BABEL] ...: Plugin .default is not a valid Babel plugin"},{"fix":"Convert to ES module or use dynamic import().","cause":"Using require() on an ESM-only package.","error":"Error: 'require' of ES Module not supported"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}