feat: support jsx

README.md

@@ -25,6 +25,7 @@ Just-in-Time Typescript and ESM support for Node.js.
 - Node.js native require cache integration
 - Filesystem transpile with hard disk caches
 - Custom resolve aliases
+- JSX support (opt-in)
 
 ## 🌟 Used by
 
@@ -211,6 +212,16 @@ Parent module's [`import.meta`](https://developer.mozilla.org/en-US/docs/Web/Jav
 
 Try to use native require and import without jiti transformations first.
 
+### `jsx`
+
+- Type: Boolean | {options}
+- Default: `false`
+- Environment Variable: `JITI_JSX`
+
+Enable JSX support using [`@babel/plugin-transform-react-jsx`](https://babeljs.io/docs/babel-plugin-transform-react-jsx).
+
+See [`test/fixtures/jsx`](./test/fixtures/jsx) for framework integration examples.
+
 ## Development
 
 - Clone this repository

lib/jiti-hooks.mjs

@@ -58,6 +58,7 @@ export async function load(url, context, nextLoad) {
     ts: url.endsWith("ts"),
     retainLines: true,
     async: true,
+    jsx: jiti.options.jsx,
   });
 
   if (url.endsWith(".js") && !transpiledSource.includes("jitiImport")) {

lib/types.d.ts

@@ -8,6 +8,11 @@ export declare function createJiti(id: string, userOptions?: JitiOptions): Jiti;
  * **Note:**It is recommended to use `await jiti.import` instead
  */
 export interface Jiti extends NodeRequire {
+  /**
+   * Resolved options
+   */
+  options: JitiOptions;
+
   /**
    * ESM import a module with additional Typescript and ESM compatibility.
    */
@@ -144,6 +149,15 @@ export interface JitiOptions {
    * Enabled if Bun is detected.
    */
   tryNative?: boolean;
+
+  /**
+   * Enable JSX support Enable JSX support using [`@babel/plugin-transform-react-jsx`](https://babeljs.io/docs/babel-plugin-transform-react-jsx).
+   *
+   * @default false
+   *
+   * You can also use `JITI_JSX=1` environment variable to enable JSX support.
+   */
+  jsx?: boolean | JSXOptions;
 }
 
 export type ModuleCache = Record<string, NodeModule>;
@@ -163,6 +177,7 @@ export interface TransformOptions {
   retainLines?: boolean;
   interopDefault?: boolean;
   async: boolean;
+  jsx?: boolean | JSXOptions;
   [key: string]: any;
 }
 
@@ -176,3 +191,14 @@ export interface JitiResolveOptions {
   parentURL?: string | URL;
   try?: boolean;
 }
+
+/** Reference: https://babeljs.io/docs/babel-plugin-transform-react-jsx#options */
+export interface JSXOptions {
+  throwIfNamespace?: boolean;
+  runtime?: "classic" | "automatic";
+  importSource?: string;
+  pragma?: string;
+  pragmaFrag?: string;
+  useBuiltIns?: boolean;
+  useSpread?: boolean;
+}

package.json

@@ -41,7 +41,7 @@
     "build": "pnpm clean && NODE_ENV=production pnpm webpack",
     "clean": "rm -rf dist",
     "dev": "pnpm clean && pnpm webpack --watch",
-    "jiti": "JITI_DEBUG=1 lib/jiti-cli.mjs",
+    "jiti": "JITI_DEBUG=1 JITI_JSX=1 lib/jiti-cli.mjs",
     "lint": "eslint . && prettier -c src lib test stubs",
     "lint:fix": "eslint --fix . && prettier -w src lib test stubs",
     "prepack": "pnpm build",
@@ -52,7 +52,7 @@
     "test:native:bun": "bun --bun test test/native/bun.test.ts",
     "test:native:deno": "deno test -A test/native/deno.test.ts",
     "test:native:node": "node --test --experimental-strip-types test/native/node.test.ts",
-    "test:node-register": "node --test test/node-register.test.mjs",
+    "test:node-register": "JITI_JSX=1 node --test test/node-register.test.mjs",
     "test:types": "tsc --noEmit"
   },
   "devDependencies": {
@@ -64,7 +64,9 @@
     "@babel/plugin-proposal-decorators": "^7.24.7",
     "@babel/plugin-syntax-class-properties": "^7.12.13",
     "@babel/plugin-syntax-import-assertions": "^7.25.6",
+    "@babel/plugin-syntax-jsx": "^7.24.7",
     "@babel/plugin-transform-export-namespace-from": "^7.24.7",
+    "@babel/plugin-transform-react-jsx": "^7.25.2",
     "@babel/plugin-transform-typescript": "^7.25.2",
     "@babel/preset-typescript": "^7.24.7",
     "@babel/template": "^7.25.0",
@@ -89,16 +91,23 @@
     "estree-walker": "^3.0.3",
     "fast-glob": "^3.3.2",
     "mlly": "^1.7.1",
+    "nano-jsx": "^0.1.0",
     "pathe": "^1.1.2",
     "pkg-types": "^1.2.0",
+    "preact": "^10.24.1",
+    "preact-render-to-string": "^6.5.11",
     "prettier": "^3.3.3",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
     "reflect-metadata": "^0.2.2",
+    "solid-js": "^1.9.1",
     "std-env": "^3.7.0",
     "terser-webpack-plugin": "^5.3.10",
     "tinyexec": "^0.3.0",
     "ts-loader": "^9.5.1",
     "typescript": "^5.6.2",
     "vitest": "^2.1.1",
+    "vue": "^3.5.8",
     "webpack": "^5.94.0",
     "webpack-bundle-analyzer": "^4.10.2",
     "webpack-cli": "^5.1.4",