lazy load native JSX compiler

Co-authored-by: Cursor <cursoragent@cursor.com>

Author: ryansolid

.changeset/lazy-load-native-compiler.md

@@ -0,0 +1,5 @@
+---
+'vite-plugin-solid': patch
+---
+
+Lazy-load the native JSX compiler so environments without native addon support can still use the default Babel compiler.

README.md

@@ -137,6 +137,9 @@ This will force SSR code in the produced files.
 
 Choose the JSX compiler backend. `"babel"` keeps using `babel-preset-solid`.
 `"native"` uses the native compiler from `@dom-expressions/jsx-compiler`.
+The native compiler requires native Node addon support, so environments that
+disable native addons (for example StackBlitz WebContainers) should use the
+default `"babel"` compiler.
 
 ```ts
 import { defineConfig } from 'vite';

src/index.ts

@@ -1,8 +1,5 @@
 import * as babel from '@babel/core';
-import {
-  transformAsync as transformJsxAsync,
-  type TransformOptions as JsxCompilerOptions,
-} from '@dom-expressions/jsx-compiler';
+import type { TransformOptions as JsxCompilerOptions } from '@dom-expressions/jsx-compiler';
 import solid from 'babel-preset-solid';
 import { existsSync, readFileSync } from 'fs';
 import { mergeAndConcat } from 'merge-anything';
@@ -56,6 +53,23 @@ export interface ExtensionOptions {
 
 export type Compiler = 'babel' | 'native';
 export type SolidOptions = Omit<JsxCompilerOptions, 'filename' | 'sourceMap'>;
+type NativeCompiler = typeof import('@dom-expressions/jsx-compiler');
+let nativeCompilerPromise: Promise<NativeCompiler> | undefined;
+
+async function loadNativeCompiler() {
+  try {
+    return await (nativeCompilerPromise ??= import('@dom-expressions/jsx-compiler'));
+  } catch (error) {
+    nativeCompilerPromise = undefined;
+    const reason = error instanceof Error ? `\n\nCause: ${error.message}` : '';
+    throw new Error(
+      'vite-plugin-solid: compiler: "native" requires native Node addon support. ' +
+        'Environments that disable native addons, such as StackBlitz WebContainers, ' +
+        'must use the default compiler: "babel".' +
+        reason,
+    );
+  }
+}
 
 /** Configuration options for vite-plugin-solid. */
 export interface Options {
@@ -570,7 +584,8 @@ export default function solidPlugin(options: Partial<Options> = {}): Plugin {
           return undefined;
         }
 
-        const result = await transformJsxAsync(supportResult.code || '', {
+        const { transformAsync } = await loadNativeCompiler();
+        const result = await transformAsync(supportResult.code || '', {
           ...solidOptions,
           filename: id,
           sourceMap: true,