feat: enable systemjs build to accept sourcemaps

deno.jsonc

@@ -4,7 +4,7 @@
     "coverage": "rm -rf coverage && deno task test --reporter=dot --coverage=coverage && deno coverage --lcov --output=coverage.lcov coverage && genhtml -o coverage/report coverage.lcov",
     "deploy-prod": "deployctl deploy --prod --project=systemjs-sh --entrypoint src/main.ts --exclude=coverage",
     "deploy": "deployctl deploy --project=systemjs-sh --entrypoint src/main.ts --exclude=coverage",
-    "dev": "deno run --watch --allow-env --allow-read --allow-run --allow-net --allow-sys --allow-ffi --allow-hrtime --unstable-kv src/main.ts",
+    "dev": "deno run --inspect --watch --allow-env --allow-read --allow-run --allow-net --allow-sys --allow-ffi --allow-hrtime --unstable-kv src/main.ts",
     "fmt": "deno fmt src/ deps.ts dev_deps.ts",
     "tag-version": "npx commit-and-tag-version && git push --follow-tags origin main",
     "test": "deno test --unstable-kv --allow-env --allow-read --allow-sys --allow-ffi --allow-hrtime --allow-run --allow-net"

src/create-request-handler.ts

@@ -235,9 +235,8 @@ export function createRequestHandler(
         upstreamSpan.end();
         if (!isRawRequest && isJsResponse(upstreamResponse)) {
             const buildSpan = tracer.startSpan('build');
-            body = replaceOrigin(
-                await toSystemjs(body, { banner: OUTPUT_BANNER }, config),
-            );
+            const buildResult = await toSystemjs(body, { banner: OUTPUT_BANNER }, config);
+            body = replaceOrigin(buildResult.code);
             buildSpan.end();
         } else {
             body = replaceOrigin(body);

src/rollup-plugin-virtual.ts

@@ -1,6 +1,6 @@
-import type { ExistingRawSourceMap, Plugin } from '../deps.ts';
+import type { Plugin } from '../deps.ts';
 import { dirname, resolve } from '../deps.ts';
-import type { RollupVirtualOptions } from './types.ts';
+import type { RollupVirtualOptions, SourceDescription } from './types.ts';
 
 const PREFIX = `virtual:`;
 
@@ -10,7 +10,7 @@ const PREFIX = `virtual:`;
 export default function virtual(modules: RollupVirtualOptions): Plugin {
     const resolvedIds = new Map<
         string,
-        string | { code: string; map: ExistingRawSourceMap }
+        string | SourceDescription
     >();
 
     Object.keys(modules).forEach((id) => {

src/to-systemjs-worker.ts

@@ -7,9 +7,9 @@ self.addEventListener(
         event: MessageEvent<{ args: Parameters<typeof toSystemjsMain> }>,
     ) => {
         // @ts-ignore
-        const transpiledCode = await toSystemjsMain(...event.data.args);
+        const build = await toSystemjsMain(...event.data.args);
         // @ts-ignore
-        self.postMessage({ code: transpiledCode });
+        self.postMessage({ build });
         // @ts-ignore
         self.close();
     },

src/to-systemjs.ts

@@ -5,15 +5,18 @@ import {
     rollup as _rollup,
     rollupVersion as _rollupVersion,
 } from '../deps.ts';
-import type { Config } from './types.ts';
+import type { BuildResult, Config, SourceModule } from './types.ts';
 import rollupPluginVirtual from './rollup-plugin-virtual.ts';
 
 export const toSystemjsMain = async (
-    esmCode: string,
+    sourceModule: string | SourceModule,
     rollupOutputOptions: OutputOptions = {},
-): Promise<string> => {
+): Promise<BuildResult> => {
     let rollup = _rollup;
     let rollupVersion = _rollupVersion;
+    const mod = typeof sourceModule === 'string'
+        ? { code: sourceModule, name: 'code' }
+        : sourceModule;
     try {
         const mod = await import('npm:rollup@4.16.4');
         // @ts-ignore
@@ -22,18 +25,17 @@ export const toSystemjsMain = async (
     } catch (_) {}
     const inputOptions: InputOptions = {
         external: () => true,
-        input: 'esmCode',
+        input: mod.name,
         plugins: [
-            // @ts-ignore untyped
-            rollupPluginVirtual({ esmCode }),
+            rollupPluginVirtual({ [mod.name]: mod }),
         ],
         treeshake: false,
     };
 
     const outputOptions: OutputOptions = {
         dir: 'out', // not really used
         format: 'systemjs' as ModuleFormat,
-        sourcemap: false,
+        sourcemap: !!mod.map,
         ...rollupOutputOptions,
         footer: `/* rollup@${rollupVersion}${
             rollupOutputOptions.footer ? ` - ${rollupOutputOptions.footer}` : ''
@@ -43,41 +45,44 @@ export const toSystemjsMain = async (
     const bundle = await rollup(inputOptions);
     const { output } = await bundle.generate(outputOptions);
     await bundle.close();
-    return output[0].code;
+    return {
+        code: output[0].code,
+        map: output[1] && output[1].type === 'asset' && typeof output[1].source === 'string' ? output[1].source : undefined,
+    };
 };
 
 export const toSystemjsWorker = async (
-    esmCode: string,
+    sourceModule: string | SourceModule,
     rollupOutputOptions: OutputOptions = {},
-): Promise<string> => {
+): Promise<BuildResult> => {
     const worker = new Worker(import.meta.resolve('./to-systemjs-worker.ts'), {
         type: 'module',
     });
     return new Promise((resolve) => {
         worker.addEventListener(
             'message',
-            (event: MessageEvent<{ code: string }>) => {
+            (event: MessageEvent<{ build: BuildResult }>) => {
                 worker.terminate();
-                resolve(event.data.code);
+                resolve(event.data.build);
             },
             false,
         );
         worker.postMessage({
-            args: [esmCode, rollupOutputOptions],
+            args: [sourceModule, rollupOutputOptions],
         });
     });
 };
 
 export const toSystemjs = async (
-    esmCode: string,
+    sourceModule: string | SourceModule,
     rollupOutputOptions: OutputOptions = {},
     options?: Pick<Config, 'WORKER_ENABLE'>,
-): Promise<string> => {
+): Promise<BuildResult> => {
     if (options?.WORKER_ENABLE && typeof Worker !== 'undefined') {
-        return toSystemjsWorker(esmCode, {
+        return toSystemjsWorker(sourceModule, {
             footer: '(worker)',
             ...rollupOutputOptions,
         });
     }
-    return toSystemjsMain(esmCode, rollupOutputOptions);
+    return toSystemjsMain(sourceModule, rollupOutputOptions);
 };

src/types.ts

@@ -1,4 +1,8 @@
-import { opentelemetry, type ServerTimingSpanExporter } from '../deps.ts';
+import {
+    type ExistingRawSourceMap,
+    opentelemetry,
+    type ServerTimingSpanExporter,
+} from '../deps.ts';
 
 export interface HttpZParam {
     name: string;
@@ -73,6 +77,18 @@ export type PartialServerTimingSpanExporter = Pick<
     'getServerTimingHeader'
 >;
 
+export interface SourceDescription {
+	code: string;
+	map?: string | ExistingRawSourceMap;
+};
+
 export interface RollupVirtualOptions {
-    [id: string]: string;
+    [id: string]: string | SourceDescription;
 }
+
+export type SourceModule = SourceDescription & { name: string };
+
+export type BuildResult = {
+    code: string;
+    map?: string;
+};