{"id":26436,"library":"static-jsx","title":"static-jsx","description":"A simple, dependency-free JSX runtime that renders JSX directly to raw HTML strings for static HTML template engines. Version 1.0.1 is the latest stable release, with no recent updates since 2022. Differentiators: no virtual DOM, no client-side hydration, purely static HTML generation. Supports both classic and automatic JSX transforms, function components, custom elements, and raw HTML escaping. Unlike React or Preact, it is not intended for interactive UIs but for server-side templating akin to Handlebars or Nunjucks, but with JSX syntax. Ships TypeScript types.","status":"maintenance","version":"1.0.1","language":"javascript","source_language":"en","source_url":"https://github.com/ianprime0509/static-jsx","tags":["javascript","jsx","static","react","typescript"],"install":[{"cmd":"npm install static-jsx","lang":"bash","label":"npm"},{"cmd":"yarn add static-jsx","lang":"bash","label":"yarn"},{"cmd":"pnpm add static-jsx","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"Library is ESM-only since v1.0.0; CommonJS require will fail.","wrong":"const { h } = require('static-jsx')","symbol":"h","correct":"import { h } from 'static-jsx'"},{"note":"Fragment is a named export, not a default export.","wrong":"import Fragment from 'static-jsx'","symbol":"Fragment","correct":"import { Fragment } from 'static-jsx'"},{"note":"Use RawHtml constructor to mark strings as safe HTML.","symbol":"RawHtml","correct":"import { RawHtml } from 'static-jsx'"},{"note":"Automatic transform imports from 'static-jsx/jsx-runtime'; do not manually import these functions.","wrong":"import { jsx } from 'static-jsx'","symbol":"jsx, jsxs, jsxDEV (automatic transform)","correct":"// In tsconfig: \"jsxImportSource\": \"static-jsx\"\n// Or per-file: /** @jsxImportSource static-jsx */"}],"quickstart":{"code":"// Install: npm install static-jsx\n\n/** @jsxImportSource static-jsx */\nimport { RawHtml } from 'static-jsx';\n\nconst bold = (text: string) => {text};\n\nconst page = (\n \n \n

Hello, World!

{bold('This is bold.')}

{new RawHtml('Raw HTML')}

\n \n \n);\n\nconsole.log(page.html);\n/* Output:\n

Hello, World!

This is bold.

Raw HTML

\n*/","lang":"typescript","description":"Renders JSX to an HTML string using automatic transform, demonstrating component usage, interpolation, and RawHtml for unescaped HTML."},"warnings":[{"fix":"Use ES import syntax or upgrade Node.js to ESM support.","message":"Library is ESM-only; CommonJS require() will throw an error.","severity":"breaking","affected_versions":">=1.0.0-alpha.5"},{"fix":"Use a bundler that supports the exports field (e.g., webpack 5+, Rollup, Vite).","message":"package.json exports field required for automatic JSX transform; older bundlers may not support it.","severity":"breaking","affected_versions":">=1.0.0-alpha.6"},{"fix":"Access the html property: element.html.","message":"JSX expressions always return a RawHtml instance, not a string. Use .html property to get the string.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Wrap safe HTML strings: new RawHtml('

safe

').","message":"Strings are escaped by default; use RawHtml constructor to insert unescaped HTML.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-05-01T00:00:00.000Z","next_check":"2026-07-30T00:00:00.000Z","problems":[{"fix":"Use import instead of require().","cause":"static-jsx is ESM-only and cannot be required.","error":"Error [ERR_REQUIRE_ESM]: require() of ES Module not supported."},{"fix":"Update bundler configuration or use classic transform with manual imports.","cause":"Bundler does not support package.json exports field.","error":"Module not found: Can't resolve 'static-jsx/jsx-runtime'"},{"fix":"Install the package: npm install static-jsx. Ensure import path is 'static-jsx'.","cause":"Package not installed or incorrect import path.","error":"Cannot find module 'static-jsx'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}