diff --git a/.changeset/gorgeous-shrimps-bow.md b/.changeset/gorgeous-shrimps-bow.md new file mode 100644 index 000000000000..dc5b8c02cb02 --- /dev/null +++ b/.changeset/gorgeous-shrimps-bow.md @@ -0,0 +1,5 @@ +--- +'@sveltejs/kit': patch +--- + +fix: strip virtual module prefix from error messages diff --git a/packages/kit/src/exports/vite/graph_analysis/index.js b/packages/kit/src/exports/vite/graph_analysis/index.js index fc683a071653..2db0e2941fbd 100644 --- a/packages/kit/src/exports/vite/graph_analysis/index.js +++ b/packages/kit/src/exports/vite/graph_analysis/index.js @@ -1,7 +1,10 @@ import path from 'node:path'; import { posixify } from '../../../utils/filesystem.js'; -const ILLEGAL_IMPORTS = new Set(['\0$env/dynamic/private', '\0$env/static/private']); +const ILLEGAL_IMPORTS = new Set([ + '\0virtual:$env/dynamic/private', + '\0virtual:$env/static/private' +]); const ILLEGAL_MODULE_NAME_PATTERN = /.*\.server\..+/; /** @@ -35,6 +38,8 @@ export function module_guard(context, { cwd, lib }) { server: posixify(path.join(lib, 'server')) }; + const display = /** @param {string} id */ (id) => id.replace('\0virtual:', ''); + /** * @param {string} id * @param {Array<{ id: string; dynamic: boolean }>} chain @@ -51,10 +56,12 @@ export function module_guard(context, { cwd, lib }) { chain.map(({ id, dynamic }, i) => { id = normalize_id(id, lib, cwd); - return `${' '.repeat(i * 2)}- ${id} ${dynamic ? 'dynamically imports' : 'imports'}\n`; - }) + `${' '.repeat(chain.length)}- ${id}`; + return `${' '.repeat(i * 2)}- ${display(id)} ${ + dynamic ? 'dynamically imports' : 'imports' + }\n`; + }) + `${' '.repeat(chain.length)}- ${display(id)}`; - const message = `Cannot import ${id} into client-side code:\n${pyramid}`; + const message = `Cannot import ${display(id)} into client-side code:\n${pyramid}`; throw new Error(message); } diff --git a/packages/kit/src/exports/vite/graph_analysis/index.spec.js b/packages/kit/src/exports/vite/graph_analysis/index.spec.js index 0df0c26465bc..292de805944f 100644 --- a/packages/kit/src/exports/vite/graph_analysis/index.spec.js +++ b/packages/kit/src/exports/vite/graph_analysis/index.spec.js @@ -44,12 +44,12 @@ test('throws an error when importing $env/static/private', () => { importedIds: ['~/src/routes/+page.svelte'] }, '~/src/routes/+page.svelte': { - importedIds: ['\0$env/static/private'] + importedIds: ['\0virtual:$env/static/private'] } }, - `Cannot import \0$env/static/private into client-side code: + `Cannot import $env/static/private into client-side code: - src/routes/+page.svelte imports - - \0$env/static/private` + - $env/static/private` ); }); @@ -60,12 +60,12 @@ test('throws an error when dynamically importing $env/static/private', () => { importedIds: ['~/src/routes/+page.svelte'] }, '~/src/routes/+page.svelte': { - dynamicallyImportedIds: ['\0$env/static/private'] + dynamicallyImportedIds: ['\0virtual:$env/static/private'] } }, - `Cannot import \0$env/static/private into client-side code: + `Cannot import $env/static/private into client-side code: - src/routes/+page.svelte dynamically imports - - \0$env/static/private` + - $env/static/private` ); }); @@ -76,12 +76,12 @@ test('throws an error when importing $env/dynamic/private', () => { importedIds: ['~/src/routes/+page.svelte'] }, '~/src/routes/+page.svelte': { - importedIds: ['\0$env/dynamic/private'] + importedIds: ['\0virtual:$env/dynamic/private'] } }, - `Cannot import \0$env/dynamic/private into client-side code: + `Cannot import $env/dynamic/private into client-side code: - src/routes/+page.svelte imports - - \0$env/dynamic/private` + - $env/dynamic/private` ); }); @@ -92,12 +92,12 @@ test('throws an error when dynamically importing $env/dynamic/private', () => { importedIds: ['~/src/routes/+page.svelte'] }, '~/src/routes/+page.svelte': { - dynamicallyImportedIds: ['\0$env/dynamic/private'] + dynamicallyImportedIds: ['\0virtual:$env/dynamic/private'] } }, - `Cannot import \0$env/dynamic/private into client-side code: + `Cannot import $env/dynamic/private into client-side code: - src/routes/+page.svelte dynamically imports - - \0$env/dynamic/private` + - $env/dynamic/private` ); }); diff --git a/packages/kit/src/exports/vite/index.js b/packages/kit/src/exports/vite/index.js index 94f242a1e468..928676241787 100644 --- a/packages/kit/src/exports/vite/index.js +++ b/packages/kit/src/exports/vite/index.js @@ -336,7 +336,7 @@ function kit({ svelte_config }) { async resolveId(id) { // treat $env/static/[public|private] as virtual if (id.startsWith('$env/') || id.startsWith('__sveltekit/') || id === '$service-worker') { - return `\0${id}`; + return `\0virtual:${id}`; } }, @@ -363,19 +363,19 @@ function kit({ svelte_config }) { } switch (id) { - case '\0$env/static/private': + case '\0virtual:$env/static/private': return create_static_module('$env/static/private', env.private); - case '\0$env/static/public': + case '\0virtual:$env/static/public': return create_static_module('$env/static/public', env.public); - case '\0$env/dynamic/private': + case '\0virtual:$env/dynamic/private': return create_dynamic_module( 'private', vite_config_env.command === 'serve' ? env.private : undefined ); - case '\0$env/dynamic/public': + case '\0virtual:$env/dynamic/public': // populate `$env/dynamic/public` from `window` if (browser) { return `export const env = ${global}.env;`; @@ -386,12 +386,12 @@ function kit({ svelte_config }) { vite_config_env.command === 'serve' ? env.public : undefined ); - case '\0$service-worker': + case '\0virtual:$service-worker': return create_service_worker_module(svelte_config); // for internal use only. it's published as $app/paths externally // we use this alias so that we won't collide with user aliases - case '\0__sveltekit/paths': { + case '\0virtual:__sveltekit/paths': { const { assets, base } = svelte_config.kit.paths; // use the values defined in `global`, but fall back to hard-coded values @@ -429,7 +429,7 @@ function kit({ svelte_config }) { `; } - case '\0__sveltekit/environment': { + case '\0virtual:__sveltekit/environment': { const { version } = svelte_config.kit; return dedent` diff --git a/packages/kit/test/apps/dev-only/test/test.js b/packages/kit/test/apps/dev-only/test/test.js index 8397bef50608..124d4188a2f7 100644 --- a/packages/kit/test/apps/dev-only/test/test.js +++ b/packages/kit/test/apps/dev-only/test/test.js @@ -11,7 +11,7 @@ test.describe.serial('Illegal imports', () => { wait_for_started: false }); expect(await page.textContent('.message-body')).toBe( - 'Cannot import \0$env/dynamic/private into client-side code' + 'Cannot import $env/dynamic/private into client-side code' ); }); @@ -20,7 +20,7 @@ test.describe.serial('Illegal imports', () => { wait_for_started: false }); expect(await page.textContent('.message-body')).toBe( - 'Cannot import \0$env/dynamic/private into client-side code' + 'Cannot import $env/dynamic/private into client-side code' ); }); @@ -29,7 +29,7 @@ test.describe.serial('Illegal imports', () => { wait_for_started: false }); expect(await page.textContent('.message-body')).toBe( - 'Cannot import \0$env/static/private into client-side code' + 'Cannot import $env/static/private into client-side code' ); }); @@ -38,7 +38,7 @@ test.describe.serial('Illegal imports', () => { wait_for_started: false }); expect(await page.textContent('.message-body')).toBe( - 'Cannot import \0$env/static/private into client-side code' + 'Cannot import $env/static/private into client-side code' ); }); diff --git a/packages/kit/test/build-errors/env.spec.js b/packages/kit/test/build-errors/env.spec.js index 02efbf296dc9..4c213918dae7 100644 --- a/packages/kit/test/build-errors/env.spec.js +++ b/packages/kit/test/build-errors/env.spec.js @@ -10,7 +10,7 @@ test('$env/dynamic/private is not statically importable from the client', () => stdio: 'pipe', timeout: 60000 }), - /.*Cannot import \0\$env\/dynamic\/private into client-side code:.*/gs + /.*Cannot import \$env\/dynamic\/private into client-side code:.*/gs ); }); @@ -22,7 +22,7 @@ test('$env/dynamic/private is not dynamically importable from the client', () => stdio: 'pipe', timeout: 60000 }), - /.*Cannot import \0\$env\/dynamic\/private into client-side code:.*/gs + /.*Cannot import \$env\/dynamic\/private into client-side code:.*/gs ); }); @@ -34,7 +34,7 @@ test('$env/static/private is not statically importable from the client', () => { stdio: 'pipe', timeout: 60000 }), - /.*Cannot import \0\$env\/static\/private into client-side code:.*/gs + /.*Cannot import \$env\/static\/private into client-side code:.*/gs ); }); @@ -46,6 +46,6 @@ test('$env/static/private is not dynamically importable from the client', () => stdio: 'pipe', timeout: 60000 }), - /.*Cannot import \0\$env\/static\/private into client-side code:.*/gs + /.*Cannot import \$env\/static\/private into client-side code:.*/gs ); });