Support npm: specifiers in @jsxImportSource pragma

Author: alexgleason

src/prefixPlugin.ts

@@ -30,5 +30,16 @@ export default function denoPrefixPlugin(
         return await resolveViteSpecifier(id, cache, root, importer);
       }
     },
+    transform(code, id) {
+      if (!id.endsWith(".ts") && !id.endsWith(".tsx")) return;
+
+      const match = code.match(
+        /\/\*\*\s*@jsxImportSource\s+npm:(@?[^@\s*]+)([^\s*]*)\s*\*\//,
+      );
+
+      if (match) {
+        return code.replace(match[0], `/** @jsxImportSource ${match[1]} */`);
+      }
+    },
   };
 }

tests/fixture/jsx.tsx

@@ -0,0 +1,10 @@
+/** @jsxRuntime automatic */
+/** @jsxImportSource npm:preact@^10.24.0 */
+
+function App() {
+  return <div>hello world</div>;
+}
+
+App();
+
+console.log("it works");

tests/fixture/vite.config.ts

@@ -27,6 +27,7 @@ export default defineConfig({
         inlineNpm: "inlineNpm.ts",
         inlineJsr: "inlineJsr.ts",
         inlineHttp: "inlineHttp.ts",
+        jsx: "jsx.tsx",
         resolveInRootDir: "resolveInRootDir.ts",
       },
     },

tests/plugin.test.ts

@@ -66,4 +66,8 @@ describe("Deno plugin", () => {
   it("resolve to file in root dir", async () => {
     await runTest(`resolveInRootDir.js`);
   });
+
+  it("resolves @jsxImportSource with npm: prefix", async () => {
+    await runTest(`jsx.js`);
+  });
 });