Skip to content

Commit 2a7cb75

Browse files
authored
Merge pull request #7940 from QwikDev/repl-better
fix(repl): support v2 + more robust resolving + css
2 parents f63a45e + 43c9ff3 commit 2a7cb75

File tree

9 files changed

+191
-130
lines changed

9 files changed

+191
-130
lines changed

packages/docs/src/repl/bundler/bundled.tsx

Lines changed: 35 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import qServerDts from '../../../node_modules/@builder.io/qwik/dist/server.d.ts?
1414
import qWasmMjs from '../../../node_modules/@builder.io/qwik/bindings/qwik.wasm.mjs?raw-source';
1515
import qWasmBinUrl from '../../../node_modules/@builder.io/qwik/bindings/qwik_wasm_bg.wasm?raw-source';
1616

17-
import { QWIK_PKG_NAME } from '../repl-constants';
17+
import { QWIK_PKG_NAME_V1, QWIK_PKG_NAME_V2 } from '../repl-constants';
1818

1919
export const getNpmCdnUrl = (
2020
bundled: PkgUrls,
@@ -32,36 +32,43 @@ export const getNpmCdnUrl = (
3232
}
3333
} else {
3434
// fall back to latest
35-
pkgVersion = pkgName === QWIK_PKG_NAME ? qwikVersion.split('-dev')[0] : '';
35+
pkgVersion =
36+
pkgName === QWIK_PKG_NAME_V1 || pkgName === QWIK_PKG_NAME_V2
37+
? qwikVersion.split('-dev')[0]
38+
: '';
3639
}
3740
}
3841
return `https://cdn.jsdelivr.net/npm/${pkgName}${pkgVersion ? '@' + pkgVersion : ''}${pkgPath}`;
3942
};
4043

44+
const qwikUrls: PkgUrls[string] = {
45+
version: qwikVersion,
46+
// For bundled version, use local files
47+
'/dist/build/index.d.ts': qBuild,
48+
'/dist/core.d.ts': qCoreDts,
49+
'/dist/core.min.mjs': qCoreMinMjs,
50+
'/dist/core.mjs': qCoreMjs,
51+
'/dist/optimizer.mjs': qOptimizerMjs,
52+
'/dist/server.mjs': qServerMjs,
53+
'/dist/server.d.ts': qServerDts,
54+
'/dist/preloader.mjs': qPreloaderMjs,
55+
'/dist/qwikloader.js': qQwikLoaderJs,
56+
'/bindings/qwik.wasm.mjs': qWasmMjs,
57+
'/bindings/qwik_wasm_bg.wasm': qWasmBinUrl,
58+
};
4159
export const bundled: PkgUrls = {
42-
[QWIK_PKG_NAME]: {
43-
version: qwikVersion,
44-
// For bundled version, use local files
45-
'/dist/build/index.d.ts': qBuild,
46-
'/dist/core.d.ts': qCoreDts,
47-
'/dist/core.min.mjs': qCoreMinMjs,
48-
'/dist/core.mjs': qCoreMjs,
49-
'/dist/optimizer.mjs': qOptimizerMjs,
50-
'/dist/server.mjs': qServerMjs,
51-
'/dist/server.d.ts': qServerDts,
52-
'/dist/preloader.mjs': qPreloaderMjs,
53-
'/dist/qwikloader.js': qQwikLoaderJs,
54-
'/bindings/qwik.wasm.mjs': qWasmMjs,
55-
'/bindings/qwik_wasm_bg.wasm': qWasmBinUrl,
56-
},
60+
[QWIK_PKG_NAME_V1]: qwikUrls,
61+
[QWIK_PKG_NAME_V2]: qwikUrls,
5762
};
5863

5964
export const getDeps = (qwikVersion: string) => {
6065
const out = { ...bundled };
6166
if (qwikVersion !== 'bundled') {
6267
const [M, m, p] = qwikVersion.split('-')[0].split('.').map(Number);
6368
const prefix = M > 1 || (M == 1 && (m > 7 || (m == 7 && p >= 2))) ? '/dist/' : '/';
64-
out[QWIK_PKG_NAME] = {
69+
const isV2 = qwikVersion >= '2';
70+
const pkgName = isV2 ? QWIK_PKG_NAME_V2 : QWIK_PKG_NAME_V1;
71+
out[QWIK_PKG_NAME_V1] = {
6572
version: qwikVersion,
6673
};
6774
for (const p of [
@@ -73,14 +80,22 @@ export const getDeps = (qwikVersion: string) => {
7380
`/bindings/qwik_wasm_bg.wasm`,
7481
`/dist/qwikloader.js`,
7582
`/dist/preloader.mjs`,
83+
'/handlers.mjs',
7684
]) {
77-
out[QWIK_PKG_NAME][p] = getNpmCdnUrl(
85+
out[QWIK_PKG_NAME_V1][p] = getNpmCdnUrl(
7886
bundled,
79-
QWIK_PKG_NAME,
87+
pkgName,
8088
qwikVersion,
8189
p.replace('/dist/', prefix)
8290
);
8391
}
92+
out[QWIK_PKG_NAME_V1]['/dist/core.d.ts'] = getNpmCdnUrl(
93+
bundled,
94+
pkgName,
95+
qwikVersion,
96+
isV2 ? '/dist/core-internal.d.ts' : `${prefix}core.d.ts`
97+
);
98+
out[QWIK_PKG_NAME_V2] = out[QWIK_PKG_NAME_V1];
8499
}
85100
return out;
86101
};

packages/docs/src/repl/bundler/bundler-worker.ts

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { rolldown, type OutputAsset, type OutputChunk } from '@rolldown/browser';
22
import type { PkgUrls, ReplInputOptions, ReplModuleOutput, ReplResult } from '../types';
33
import { definesPlugin, replCss, replMinify, replResolver } from './rollup-plugins';
4-
import { QWIK_PKG_NAME } from '../repl-constants';
4+
import { QWIK_PKG_NAME_V1 } from '../repl-constants';
55

66
// Worker message types
77
interface MessageBase {
@@ -65,7 +65,7 @@ self.onmessage = async (e: MessageEvent<IncomingMessage>) => {
6565
};
6666
self.postMessage(message);
6767
} catch (error) {
68-
console.error(`Bundler worker for %s failed`, deps[QWIK_PKG_NAME].version, error);
68+
console.error(`Bundler worker for %s failed`, deps[QWIK_PKG_NAME_V1].version, error);
6969
const message: ErrorMessage = {
7070
type: 'error',
7171
buildId: e.data.buildId,
@@ -83,7 +83,7 @@ self.onmessage = async (e: MessageEvent<IncomingMessage>) => {
8383

8484
let version: number[];
8585
async function loadOptimizer() {
86-
const qwikDeps = deps[QWIK_PKG_NAME];
86+
const qwikDeps = deps[QWIK_PKG_NAME_V1];
8787
version = qwikDeps.version.split('.').map((v) => parseInt(v, 10));
8888
const wasmLoader = await import(/* @vite-ignore */ qwikDeps['/bindings/qwik.wasm.mjs']);
8989

@@ -128,6 +128,7 @@ async function performBundle(message: BundleMessage): Promise<ReplResult> {
128128
const baseUrl = `/repl/${replId}/`;
129129
const defines = {
130130
'import.meta.env.BASE_URL': JSON.stringify(baseUrl),
131+
'import.meta.env': JSON.stringify({}),
131132
};
132133

133134
const onwarn = (warning: any) => {

packages/docs/src/repl/bundler/rollup-plugins.ts

Lines changed: 58 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import type { Plugin } from '@rolldown/browser';
22
import type { MinifyOptions } from 'terser';
33
import { minify } from 'terser';
44
import type { PkgUrls, ReplInputOptions } from '../types';
5-
import { QWIK_PKG_NAME } from '../repl-constants';
5+
import { QWIK_PKG_NAME_V1 } from '../repl-constants';
66

77
export const definesPlugin = (defines: Record<string, string>): Plugin => {
88
return {
@@ -35,29 +35,54 @@ export const replResolver = (
3535
return srcInputs.find((i) => i.path === id)?.path;
3636
};
3737

38-
return {
38+
const getQwik = (id: string, external?: true) => {
39+
const path = deps[QWIK_PKG_NAME_V1][id];
40+
if (!path) {
41+
throw new Error(`Unknown Qwik path: ${id}`);
42+
}
43+
return {
44+
id: `\0@qwik${id}`,
45+
sideEffects: false,
46+
// It would be nice to load qwik as external, but
47+
// we import core and core/build so we need processing
48+
};
49+
};
50+
const plugin: Plugin = {
3951
name: 'repl-resolver',
4052

4153
resolveId(id, importer) {
42-
// Re-resolve
43-
if (id.startsWith('@qwik/')) {
44-
return id;
45-
}
46-
if (
47-
id === '@builder.io/qwik' ||
48-
id === '@builder.io/qwik/jsx-runtime' ||
49-
id === '@builder.io/qwik/jsx-dev-runtime'
50-
) {
51-
return '@qwik/dist/core.mjs';
54+
// Assets and vite dev mode
55+
if (id.startsWith('/assets/') || id.startsWith('/raw-fs/')) {
56+
return { id: new URL(id, location.href).href, external: true };
5257
}
53-
if (id === '@builder.io/qwik/server') {
54-
return '@qwik/dist/server.mjs';
58+
if (id.startsWith('http')) {
59+
return { id, external: true };
5560
}
56-
if (id.includes('@builder.io/qwik/preloader')) {
57-
return '@qwik/dist/preloader.mjs';
61+
if (id.startsWith('\0@qwik/')) {
62+
return id;
5863
}
59-
if (id.includes('@builder.io/qwik/qwikloader')) {
60-
return '@qwik/dist/qwikloader.js';
64+
const match = id.match(/(@builder\.io\/qwik|@qwik\.dev\/core)(.*)/);
65+
if (match) {
66+
const pkgName = match[2];
67+
68+
if (pkgName === '/build') {
69+
return `\0@qwik/build`;
70+
}
71+
if (!pkgName || pkgName === '/jsx-runtime' || pkgName === '/jsx-dev-runtime') {
72+
return getQwik('/dist/core.mjs');
73+
}
74+
if (pkgName === '/server') {
75+
return getQwik('/dist/server.mjs');
76+
}
77+
if (pkgName.includes('/preloader')) {
78+
return getQwik('/dist/preloader.mjs');
79+
}
80+
if (pkgName.includes('/qwikloader')) {
81+
return getQwik('/dist/qwikloader.js');
82+
}
83+
if (pkgName.includes('/handlers')) {
84+
return getQwik('/handlers.mjs');
85+
}
6186
}
6287
// Simple relative file resolution
6388
if (/^[./]/.test(id)) {
@@ -82,23 +107,34 @@ export const replResolver = (
82107
if (input && typeof input.code === 'string') {
83108
return input.code;
84109
}
85-
if (id.startsWith('@qwik/')) {
86-
const path = id.slice(5);
87-
const url = deps[QWIK_PKG_NAME][path];
110+
if (id.startsWith('\0@qwik/')) {
111+
const path = id.slice('\0@qwik'.length);
112+
if (path === '/build') {
113+
// Virtual module for Qwik build
114+
const isDev = options.buildMode === 'development';
115+
const isServer = target === 'ssr';
116+
return `
117+
export const isDev = ${isDev};
118+
export const isServer = ${isServer};
119+
export const isClient = ${!isServer};
120+
`;
121+
}
122+
const url = deps[QWIK_PKG_NAME_V1][path];
88123
if (url) {
89124
const rsp = await fetch(url);
90125
if (rsp.ok) {
91126
return rsp.text();
92127
}
93128
}
94-
throw new Error(`Unable to load Qwik module: ${id}`);
129+
throw new Error(`Unable to load Qwik module: ${path}`);
95130
}
96131
// We're the fallback, we know all the files
97132
if (/\.[jt]sx?$/.test(id)) {
98133
throw new Error(`load: unknown module ${id}`);
99134
}
100135
},
101136
};
137+
return plugin;
102138
};
103139

104140
export const replCss = (options: Pick<ReplInputOptions, 'srcInputs'>): Plugin => {
Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
1-
export const QWIK_PKG_NAME = '@builder.io/qwik';
1+
export const QWIK_PKG_NAME_V1 = '@builder.io/qwik';
2+
export const QWIK_PKG_NAME_V2 = '@qwik.dev/core';
23

34
export const QWIK_REPL_DEPS_CACHE = 'QwikReplDeps';
45
export const QWIK_REPL_RESULT_CACHE = 'QwikReplResults';

0 commit comments

Comments
 (0)