vike 0.4.196 → 0.4.197-commit-9db6c02

package/dist/esm/client/shared/preparePageContextForUserConsumptionClientSide.js

@@ -1,20 +1,7 @@
 export { preparePageContextForUserConsumptionClientSide };
-import { assert, isObject, objectAssign } from '../server-routing-runtime/utils.js';
-import { sortPageContext } from '../../shared/sortPageContext.js';
-import { addIs404ToPageProps } from '../../shared/addIs404ToPageProps.js';
+import { assert, objectAssign } from '../server-routing-runtime/utils.js';
 import { getPageContextProxyForUser } from './getPageContextProxyForUser.js';
-// Release `pageContext` for user consumption.
-//
-// This adds `assertPassToClient()`.
-//
-// With Vue support (when `pageContext` is made reactive with Vue).
-//
-// For Vue + Cient Routing, the `pageContext` needs to be made reactive:
-// ```js
-// import { reactive } from 'vue'
-// // See entire example at `/examples/vue-full/`
-// const pageContextReactive = reactive(pageContext)
-// ```
+import { preparePageContextForUserConsumption } from '../../shared/preparePageContextForUserConsumption.js';
 function preparePageContextForUserConsumptionClientSide(pageContext, isClientRouting) {
     if (isClientRouting) {
         const pageContextTyped = pageContext;
@@ -26,22 +13,26 @@ function preparePageContextForUserConsumptionClientSide(pageContext, isClientRou
         assert(pageContextTyped.isHydration === true);
         assert(pageContextTyped.isBackwardNavigation === null);
     }
-    assert('config' in pageContext);
-    assert('configEntries' in pageContext);
-    // TODO/v1-release: remove
-    assert('exports' in pageContext);
-    assert('exportsAll' in pageContext);
-    assert('pageExports' in pageContext);
-    assert(isObject(pageContext.pageExports));
-    const Page = pageContext.exports.Page;
+    const Page = pageContext.config.Page ||
+        // TODO/next-major-release: remove
+        pageContext.exports.Page;
     objectAssign(pageContext, { Page });
-    // For Vue's reactivity
+    // TODO/next-major-release: remove
+    // - Requires https://github.com/vikejs/vike-vue/issues/198
+    // - Last time I tried to remove it (https://github.com/vikejs/vike/commit/705fd23598d9d69bf46a52c8550216cd7117ce71) the tests were failing as expected: only the Vue integrations that used shallowReactive() failed.
+    supportVueReactiviy(pageContext);
+    preparePageContextForUserConsumption(pageContext);
+    const pageContextProxy = getPageContextProxyForUser(pageContext);
+    return pageContextProxy;
+}
+// With Vue + Cient Routing, the `pageContext` is made reactive:
+// ```js
+// import { reactive } from 'vue'
+// // See /examples/vue-full/renderer/createVueApp.ts
+// const pageContextReactive = reactive(pageContext)
+// ```
+function supportVueReactiviy(pageContext) {
     resolveGetters(pageContext);
-    // For prettier `console.log(pageContext)`
-    sortPageContext(pageContext);
-    const pageContextForUserConsumption = getPageContextProxyForUser(pageContext);
-    addIs404ToPageProps(pageContext);
-    return pageContextForUserConsumption;
 }
 // Remove propery descriptor getters because they break Vue's reactivity.
 // E.g. resolve the `pageContext.urlPathname` getter.

package/dist/esm/client/shared/removeFoucBuster.js

@@ -8,15 +8,16 @@ import { assert } from './utils.js';
 function removeFoucBuster() {
     assert(import.meta.env.DEV);
     let sleep = 2;
-    const runClean = () => {
-        const isClean = clean();
-        if (!isClean) {
+    setTimeout(runClean, sleep);
+    return;
+    function runClean() {
+        const isCleaned = clean();
+        if (!isCleaned) {
             if (sleep < 1000)
                 sleep = 2 * sleep;
             setTimeout(runClean, sleep);
         }
-    };
-    setTimeout(runClean, sleep);
+    }
 }
 function clean() {
     const VITE_ID = 'data-vite-dev-id';
@@ -30,15 +31,20 @@ function clean() {
     //  - https://github.com/vikejs/vike/blob/fae90a15d88e5e87ca9fcbb54cf2dc8773d2f229/vike/node/runtime/html/injectAssets/inferHtmlTags.ts#L35
     //  - https://github.com/vikejs/vike/blob/fae90a15d88e5e87ca9fcbb54cf2dc8773d2f229/vike/node/runtime/renderPage/getPageAssets.ts#L68
     const injectedByVike = [...document.querySelectorAll(`link[rel="stylesheet"][type="text/css"][href$="${suffix}"]`)];
-    let isClean = true;
-    injectedByVike.forEach((link) => {
-        const filePathAbsoluteUserRootDir = link.getAttribute('href').slice(0, -suffix.length);
+    let isCleaned = true;
+    injectedByVike.forEach((linkVike) => {
+        const href = linkVike.getAttribute('href');
+        assert(href && href.endsWith(suffix));
+        let filePathAbsoluteUserRootDir = href.slice(0, -suffix.length);
+        const prefix = '/@fs/';
+        if (filePathAbsoluteUserRootDir.startsWith(prefix))
+            filePathAbsoluteUserRootDir = filePathAbsoluteUserRootDir.slice(prefix.length);
         if (injectedByVite.some((filePathAbsoluteFilesystem) => filePathAbsoluteFilesystem.endsWith(filePathAbsoluteUserRootDir))) {
-            link.remove();
+            linkVike.remove();
         }
         else {
-            isClean = false;
+            isCleaned = false;
         }
     });
-    return isClean;
+    return isCleaned;
 }

package/dist/esm/node/plugin/plugins/importUserCode/v1-design/getVikeConfig/configDefinitionsBuiltIn.js

@@ -67,6 +67,11 @@ const configDefinitionsBuiltIn = {
     hydrationCanBeAborted: {
         env: { client: true }
     },
+    prefetch: {
+        env: { client: true },
+        eager: true
+    },
+    // TODO/v1-release: remove
     prefetchStaticAssets: {
         env: { client: true }
     },
@@ -100,10 +105,12 @@ const configDefinitionsBuiltIn = {
     },
     onBeforeRenderEnv: {
         env: { client: true },
+        eager: true,
         _computed: (configValueSources) => !isConfigSet(configValueSources, 'onBeforeRender') ? null : getConfigEnv(configValueSources, 'onBeforeRender')
     },
     dataEnv: {
         env: { client: true },
+        eager: true,
         _computed: (configValueSources) => !isConfigSet(configValueSources, 'data') ? null : getConfigEnv(configValueSources, 'data')
     },
     hooksTimeout: {
@@ -120,6 +127,9 @@ const configDefinitionsBuiltIn = {
     },
     require: {
         env: { config: true }
+    },
+    keepScrollPosition: {
+        env: { client: true }
     }
 };
 const configDefinitionsBuiltInGlobal = {
@@ -146,7 +156,13 @@ function getConfigEnv(configValueSources, configName) {
     const configValueSource = getConfigValueSource(configValueSources, configName);
     if (!configValueSource)
         return null;
-    return configValueSource.configEnv;
+    const { configEnv } = configValueSource;
+    const env = {};
+    if (configEnv.client)
+        env.client = true;
+    if (configEnv.server)
+        env.server = true;
+    return env;
 }
 function isConfigSet(configValueSources, configName) {
     const configValueSource = getConfigValueSource(configValueSources, configName);

package/dist/esm/node/plugin/plugins/importUserCode/v1-design/getVikeConfig/loadFileAtConfigTime.js

@@ -6,7 +6,7 @@ import { assert, assertUsage, hasProp, assertIsNotProductionRuntime } from '../.
 import { transpileAndExecuteFile } from './transpileAndExecuteFile.js';
 import { assertPlusFileExport } from '../../../../../../shared/page-configs/assertPlusFileExport.js';
 import pc from '@brillout/picocolors';
-import { parsePointerImportData } from './transformFileImports.js';
+import { parsePointerImportData } from './transformPointerImports.js';
 import { getConfigFileExport } from '../getConfigFileExport.js';
 import { resolvePointerImport } from './resolvePointerImport.js';
 assertIsNotProductionRuntime();

package/dist/esm/node/plugin/plugins/importUserCode/v1-design/getVikeConfig/resolvePointerImport.d.ts

@@ -2,7 +2,7 @@ export { resolvePointerImportOfConfig };
 export { resolvePointerImport };
 export { clearFilesEnvMap };
 import type { ConfigEnvInternal, DefinedAtFilePath } from '../../../../../../shared/page-configs/PageConfig.js';
-import { type PointerImportData } from './transformFileImports.js';
+import { type PointerImportData } from './transformPointerImports.js';
 import type { FilePath, FilePathResolved } from '../../../../../../shared/page-configs/FilePath.js';
 type PointerImportResolved = DefinedAtFilePath & {
     fileExportName: string;

package/dist/esm/node/plugin/plugins/importUserCode/v1-design/getVikeConfig/resolvePointerImport.js

@@ -3,7 +3,7 @@ export { resolvePointerImport };
 export { clearFilesEnvMap };
 import pc from '@brillout/picocolors';
 import { assert, assertIsNpmPackageImport, assertPosixPath, assertUsage, deepEqual, isFilePathAbsolute, requireResolve } from '../../../../utils.js';
-import { parsePointerImportData } from './transformFileImports.js';
+import { parsePointerImportData } from './transformPointerImports.js';
 import path from 'path';
 import { getFilePathAbsoluteUserRootDir, getFilePathResolved, getFilePathUnresolved } from '../../../../shared/getFilePath.js';
 const filesEnvMap = new Map();
@@ -16,7 +16,7 @@ function resolvePointerImportOfConfig(configValue, importerFilePath, userRootDir
     const { importPath, exportName } = pointerImportData;
     const filePath = resolvePointerImport(pointerImportData, importerFilePath, userRootDir);
     const fileExportPathToShowToUser = exportName === 'default' || exportName === configName ? [] : [exportName];
-    assertFileEnv(filePath.filePathAbsoluteFilesystem, importPath, configEnv, configName);
+    assertUsageFileEnv(filePath.filePathAbsoluteFilesystem, importPath, configEnv, configName);
     return {
         ...filePath,
         fileExportName: exportName,
@@ -24,33 +24,36 @@ function resolvePointerImportOfConfig(configValue, importerFilePath, userRootDir
     };
 }
 function resolvePointerImport(pointerImportData, importerFilePath, userRootDir) {
+    // `importPath` should be one of the following:
+    // - A relative import path
+    // - A filesystem absolute path
+    // - An npm package import
     const { importPath } = pointerImportData;
     const filePathAbsoluteFilesystem = resolveImportPathWithNode(pointerImportData, importerFilePath);
     let filePath;
-    // - importPath is one of the following. (See `transpileAndExecuteFile()`.)
-    //   - A relative import path
-    //   - A filesystem absolute path
-    //   - An npm package import
-    // - importPath cannot be a path alias (since esbuild resolves path aliases, see transpileAndExecuteFile.ts)
     assertPosixPath(importPath);
     if (importPath.startsWith('.') || isFilePathAbsolute(importPath)) {
         if (importPath.startsWith('.')) {
-            assert(importPath.startsWith('./') || importPath.startsWith('../'));
+            assertUsage(importPath.startsWith('./') || importPath.startsWith('../'), `Invalid relative import path ${pc.code(importPath)} defined by ${importerFilePath.filePathToShowToUser} because it should start with ${pc.code('./')} or ${pc.code('../')}, or use an npm package import instead.`);
         }
-        assertImportPath(filePathAbsoluteFilesystem, pointerImportData, importerFilePath);
+        // Pointer imports are included in virtual files, thus relative imports need to be resolved. (Virtual modules cannot contain relative imports.)
+        assertUsageResolutionSuccess(filePathAbsoluteFilesystem, pointerImportData, importerFilePath);
+        // Pointer imports are included in virtual files, and we need filePathAbsoluteUserRootDir because we didn't find a way to have filesystem absolute import paths in virtual files: https://gist.github.com/brillout/2315231c9a8164f950c64b4b4a7bbd39
+        const errSuffix = `outside of the ${userRootDir} directory which is forbidden: make sure your import paths resolve inside the ${userRootDir} directory, or import from an npm package.`;
         const filePathAbsoluteUserRootDir = getFilePathAbsoluteUserRootDir({ filePathAbsoluteFilesystem, userRootDir });
-        // This assert() is guarenteed, see assertUsage() in the onResolve() esbuild hook in transpileAndExecuteFile.ts
-        assert(filePathAbsoluteUserRootDir);
-        // Imports are included in virtual files, thus the relative path of imports need to resolved.
-        // ```
-        // [vite] Internal server error: Failed to resolve import "./onPageTransitionHooks" from "virtual:vike:pageConfigValuesAll:client:/pages/index". Does the file exist?
-        // ```
+        if (importPath.startsWith('.')) {
+            assertUsage(filePathAbsoluteUserRootDir, `The relative import ${pc.cyan(importPath)} defined by ${importerFilePath.filePathToShowToUser} resolves to ${filePathAbsoluteFilesystem} ${errSuffix}`);
+        }
+        else {
+            assert(isFilePathAbsolute(importPath));
+            assertUsage(filePathAbsoluteUserRootDir, `The import path ${importPath} defined by ${importerFilePath.filePathToShowToUser} is ${errSuffix}`);
+        }
+        // Forbid node_modules/ because it's brittle: if node_modules/ lives outside of userRootDir then it crashes.
+        assertUsage(!filePathAbsoluteUserRootDir.includes('/node_modules/'), `The import path ${importPath} defined by ${importerFilePath.filePathToShowToUser} resolves to ${filePathAbsoluteFilesystem} inside of node_modules/ which is forbbiden: use an npm package import instead.`);
         filePath = getFilePathResolved({ filePathAbsoluteUserRootDir, userRootDir });
     }
     else {
         const importPathAbsolute = importPath;
-        // importPath cannot be a path alias (since esbuild resolves path aliases, see transpileAndExecuteFile.ts)
-        assertIsNpmPackageImport(importPathAbsolute);
         if (filePathAbsoluteFilesystem) {
             filePath = getFilePathResolved({
                 userRootDir,
@@ -76,14 +79,14 @@ function resolveImportPathWithNode(pointerImportData, importerFilePath) {
     const filePathAbsoluteFilesystem = requireResolve(pointerImportData.importPath, cwd);
     return filePathAbsoluteFilesystem;
 }
-function assertImportPath(filePathAbsoluteFilesystem, pointerImportData, importerFilePath) {
+function assertUsageResolutionSuccess(filePathAbsoluteFilesystem, pointerImportData, importerFilePath) {
     const { importPath: importPath, importStringWasGenerated, importString } = pointerImportData;
     const { filePathToShowToUser } = importerFilePath;
     if (!filePathAbsoluteFilesystem) {
-        const importPathString = pc.cyan(`'${importPath}'`);
+        const importPathString = pc.code(`${importPath}`);
         const errIntro = importStringWasGenerated
             ? `The import path ${importPathString} in ${filePathToShowToUser}`
-            : `The import ${pc.cyan(importString)} defined in ${filePathToShowToUser}`;
+            : `The import ${pc.code(importString)} defined by ${filePathToShowToUser}`;
         const errIntro2 = `${errIntro} couldn't be resolved: does ${importPathString}`;
         if (importPath.startsWith('.')) {
             assert(importPath.startsWith('./') || importPath.startsWith('../'));
@@ -94,7 +97,7 @@ function assertImportPath(filePathAbsoluteFilesystem, pointerImportData, importe
         }
     }
 }
-function assertFileEnv(filePathAbsoluteFilesystem, importPath, configEnv, configName) {
+function assertUsageFileEnv(filePathAbsoluteFilesystem, importPath, configEnv, configName) {
     let key;
     if (filePathAbsoluteFilesystem) {
         key = filePathAbsoluteFilesystem;
@@ -113,7 +116,7 @@ function assertFileEnv(filePathAbsoluteFilesystem, importPath, configEnv, config
     if (configDifferentEnv) {
         assertUsage(false, [
             `${key} defines the value of configs living in different environments:`,
-            ...[configDifferentEnv, { configName, configEnv }].map((c) => `  - config ${pc.cyan(c.configName)} which value lives in environment ${pc.cyan(JSON.stringify(c.configEnv))}`),
+            ...[configDifferentEnv, { configName, configEnv }].map((c) => `  - config ${pc.code(c.configName)} which value lives in environment ${pc.code(JSON.stringify(c.configEnv))}`),
             'Defining config values in the same file is allowed only if they live in the same environment, see https://vike.dev/config#pointer-imports'
         ].join('\n'));
     }

package/dist/esm/node/plugin/plugins/importUserCode/v1-design/getVikeConfig/{transformFileImports.d.ts → transformPointerImports.d.ts}

@@ -1,8 +1,8 @@
-export { transformFileImports };
+export { transformPointerImports };
 export { parsePointerImportData };
 export { isPointerImportData };
 export type { PointerImportData };
-declare function transformFileImports(code: string, filePathToShowToUser2: string, pointerImports: Record<string, boolean> | 'all', skipWarnings?: true): string | null;
+declare function transformPointerImports(code: string, filePathToShowToUser2: string, pointerImports: Record<string, boolean> | 'all', skipWarnings?: true): string | null;
 /**
  * Data Structure for [pointer imports](https://vike.dev/config#pointer-imports):
  *   `import { someExport as someImport } from './some-file'`

package/dist/esm/node/plugin/plugins/importUserCode/v1-design/getVikeConfig/{transformFileImports.js → transformPointerImports.js}

@@ -1,4 +1,4 @@
-export { transformFileImports };
+export { transformPointerImports };
 export { parsePointerImportData };
 export { isPointerImportData };
 // Playground: https://github.com/brillout/acorn-playground
@@ -19,9 +19,8 @@ export { isPointerImportData };
 import { parse } from 'acorn';
 import { assert, assertUsage, assertWarning, styleFileRE } from '../../../../utils.js';
 import pc from '@brillout/picocolors';
-// TODO: rename transformFileImports() => transformPointerImports()
-function transformFileImports(code, filePathToShowToUser2, pointerImports, 
-// For ./transformFileImports.spec.ts
+function transformPointerImports(code, filePathToShowToUser2, pointerImports, 
+// For ./transformPointerImports.spec.ts
 skipWarnings) {
     const spliceOperations = [];
     // Performance trick

package/dist/esm/node/plugin/plugins/importUserCode/v1-design/getVikeConfig/transpileAndExecuteFile.js

@@ -7,8 +7,8 @@ import fs from 'fs';
 import path from 'path';
 import pc from '@brillout/picocolors';
 import { import_ } from '@brillout/import';
-import { assertPosixPath, getRandomId, assertIsNotProductionRuntime, assert, assertWarning, isObject, toPosixPath, assertUsage, isJavaScriptFile, createDebugger, assertFilePathAbsoluteFilesystem, assertIsNpmPackageImport } from '../../../../utils.js';
-import { transformFileImports } from './transformFileImports.js';
+import { assertPosixPath, getRandomId, assertIsNotProductionRuntime, assert, assertWarning, isObject, toPosixPath, assertUsage, isPlainJavaScriptFile, createDebugger, assertFilePathAbsoluteFilesystem, assertIsNpmPackageImport } from '../../../../utils.js';
+import { transformPointerImports } from './transformPointerImports.js';
 import { vikeConfigDependencies } from '../getVikeConfig.js';
 import 'source-map-support/register.js';
 import { getFilePathAbsoluteUserRootDir } from '../../../../shared/getFilePath.js';
@@ -17,7 +17,7 @@ const debug = createDebugger('vike:pointer-imports');
 async function transpileAndExecuteFile(filePath, userRootDir, isConfigFile) {
     const { filePathAbsoluteFilesystem, filePathToShowToUserResolved } = filePath;
     const fileExtension = getFileExtension(filePathAbsoluteFilesystem);
-    assertUsage(isJavaScriptFile(filePathAbsoluteFilesystem), `${filePathToShowToUserResolved} has file extension .${fileExtension} but a config file can only be a JavaScript/TypeScript file`);
+    assertUsage(isPlainJavaScriptFile(filePathAbsoluteFilesystem), `${filePathToShowToUserResolved} has file extension .${fileExtension} but a config file can only be a JavaScript/TypeScript file`);
     const isHeader = isHeaderFile(filePathAbsoluteFilesystem);
     if (isHeader) {
         assertWarning(false, `${pc.cyan('.h.js')} files are deprecated: simply renaming ${filePathToShowToUserResolved} to ${removeHeaderFileExtension(filePathToShowToUserResolved)} is usually enough, although you may occasionally need to use ${pc.cyan("with { type: 'pointer' }")} as explained at https://vike.dev/config#pointer-imports`, { onlyOnce: true });
@@ -45,17 +45,17 @@ async function transpileFile(filePath, transformImports, userRootDir) {
         debug(`code, post esbuild (${filePathToShowToUserResolved})`, code);
     let isImportTransformed = false;
     if (transformImports) {
-        const codeMod = transformFileImports(code, filePathToShowToUserResolved, pointerImports);
+        const codeMod = transformPointerImports(code, filePathToShowToUserResolved, pointerImports);
         if (codeMod) {
             code = codeMod;
             isImportTransformed = true;
             if (debug.isActivated)
-                debug(`code, post transformImports() (${filePathToShowToUserResolved})`, code);
+                debug(`code, post pointer imports transform (${filePathToShowToUserResolved})`, code);
         }
     }
     if (!isImportTransformed) {
         if (debug.isActivated)
-            debug(`code, no transformImports() (${filePathToShowToUserResolved})`);
+            debug(`code, no pointer imports (${filePathToShowToUserResolved})`);
     }
     return code;
 }
@@ -103,12 +103,12 @@ async function transpileWithEsbuild(filePath, userRootDir, transformImports) {
                     opts.pluginData = { [useEsbuildResolver]: true };
                     const resolved = await build.resolve(path, opts);
                     if (resolved.errors.length > 0) {
-                        /* We could do the following to let Node.js throw the error, but we don't because the error shown by esbuild is prettier: the Node.js error refers to the transpiled [build-f7i251e0iwnw]+config.ts.mjs file which isn't that nice, whereas esbuild refers to the source +config.ts file.
+                        /* We could do the following to let Node.js throw the error, but we don't because the error shown by esbuild is prettier: the Node.js error refers to the transpiled [build-f7i251e0iwnw]+config.ts.mjs whereas esbuild refers to the source +config.ts file.
                         pointerImports[args.path] = false
                         return { external: true }
                         */
-                        // Let esbuild throw the error. (It throws a nice & pretty error.)
                         cleanEsbuildErrors(resolved.errors);
+                        // Let esbuild throw the error
                         return resolved;
                     }
                     assert(resolved.path);
@@ -116,73 +116,70 @@ async function transpileWithEsbuild(filePath, userRootDir, transformImports) {
                     const importPathOriginal = args.path;
                     // Esbuild resolves path aliases.
                     // - Enabling us to use:
-                    //   ```js
-                    //   isNpmPackageImport(str, { cannotBePathAlias: true })
-                    //   assertIsNpmPackageImport()
-                    //   ```
+                    //   - assertIsNpmPackageImport()
+                    //   - isNpmPackageImport(str, { cannotBePathAlias: true })
                     assertFilePathAbsoluteFilesystem(importPathResolved);
                     // vike-{react,vue,solid} follow the convention that their config export resolves to a file named +config.js
                     //  - This is temporary, see comment below.
-                    const isVikeExtensionConfigImport = importPathResolved.endsWith('+config.js');
+                    const isVikeExtensionImport = importPathResolved.endsWith('+config.js');
                     const isPointerImport = transformImports === 'all' ||
-                        // .jsx, .vue, .svg, ... => obviously not config code
-                        !isJavaScriptFile(importPathResolved) ||
-                        // Import of a Vike extension config => make it a pointer import because we want to show nice error messages (that can display whether a configas been set by the user or by a Vike extension).
-                        //  - We should have Node.js directly load vike-{react,vue,solid} while enforcing Vike extensions to set 'name' in their +config.js file.
+                        // .jsx, .vue, .svg, ... => obviously not config code => pointer import
+                        !isPlainJavaScriptFile(importPathResolved) ||
+                        // Import of a Vike extension config => make it a pointer import because we want to show nice error messages (that can display whether a config has been set by the user or by a Vike extension).
+                        //  - TODO/eventually: stop doing this and, instead, let Node.js directly load vike-{react,vue,solid} while enforcing Vike extensions to set 'name' in their +config.js file.
                         //    - vike@0.4.162 already started soft-requiring Vike extensions to set the name config
-                        isVikeExtensionConfigImport ||
-                        // Cannot be resolved by esbuild => take a leap of faith and make it a pointer import.
-                        //  - For example if esbuild cannot resolve a path alias while Vite can.
-                        //    - When tsconfig.js#compilerOptions.paths is set, then esbuild is able to resolve the path alias.
-                        resolved.errors.length > 0;
+                        isVikeExtensionImport;
                     assertPosixPath(importPathResolved);
                     const isNodeModules = importPathResolved.includes('/node_modules/');
                     const isExternal = isPointerImport ||
-                        // Performance: npm package imports that aren't pointer imports can be externalized. For example, if Vike eventually adds support for setting Vite configs in the vike.config.js file, then the user may import a Vite plugin in his vike.config.js file. (We could as well let esbuild always transpile /node_modules/ code but it would be useless and would unnecessarily slow down transpilation.)
+                        // Performance: npm package imports can be externalized. (We could as well let esbuild transpile /node_modules/ code but it's useless as /node_modules/ code is already built. It would unnecessarily slow down transpilation.)
                         isNodeModules;
-                    const filePathAbsoluteUserRootDir = getFilePathAbsoluteUserRootDir({
-                        filePathAbsoluteFilesystem: importPathResolved,
-                        userRootDir
-                    });
+                    if (!isExternal) {
+                        // User-land config code (i.e. not runtime code) => let esbuild transpile it
+                        assert(!isPointerImport && !isNodeModules);
+                        if (debug.isActivated)
+                            debug('onResolved()', { args, resolved, isPointerImport, isExternal });
+                        return resolved;
+                    }
                     let importPathTranspiled;
                     assertPosixPath(importPathOriginal);
                     if (importPathOriginal.startsWith('./') || importPathOriginal.startsWith('../')) {
-                        // - We need this assertUsage() because we didn't find a way (yet?) to use filesystem absolute import paths in virtual files.
-                        // - Alternatively, we can again try one of the following for generating the imports of virtual files. (Last time we tried none of it worked.)
-                        //   - ~~~js
-                        //     assert(filePathAbsoluteFilesystem.startsWith('/'))
-                        //     filePath = `/@fs${filePathAbsoluteFilesystem}`
-                        //     ~~~
-                        //   - ~~~js
-                        //     assert(filePathAbsoluteUserRootDir.startsWith('../'))
-                        //     filePathAbsoluteUserRootDir = '/' + filePathAbsoluteUserRootDir
-                        //     ~~~
-                        assertUsage(filePathAbsoluteUserRootDir, `Import ${pc.cyan(importPathOriginal)} resolves to ${importPathResolved} outside of ${userRootDir} which is forbidden: make sure your relative import paths resolve inside ${userRootDir}, or import from an npm package.`);
                         importPathTranspiled = importPathResolved;
                     }
                     else {
-                        // importPathOriginal is either:
+                        // `importPathOriginal` is either:
                         //  - Npm package import
                         //  - Path alias
+                        const filePathAbsoluteUserRootDir = getFilePathAbsoluteUserRootDir({
+                            filePathAbsoluteFilesystem: importPathResolved,
+                            userRootDir
+                        });
+                        // We assuming that path aliases always resolve inside `userRootDir`.
                         if (filePathAbsoluteUserRootDir && !isNodeModules) {
-                            // importPathOriginal is most likely (always?) a path alias.
+                            // `importPathOriginal` is a path alias.
+                            // - We have to use esbuild's path alias resolution, because:
+                            //   - Vike doesn't resolve path aliases at all.
+                            //   - Node.js doesn't support `tsconfig.js#compilerOptions.paths`.
+                            // - Esbuild path alias resolution seems to be reliable, e.g. it supports `tsconfig.js#compilerOptions.paths`.
                             importPathTranspiled = importPathResolved;
                         }
                         else {
-                            // importPathOriginal is an npm package import. (Assuming path aliases always resolve inside `userRootDir`.)
+                            // `importPathOriginal` is an npm package import.
                             assertIsNpmPackageImport(importPathOriginal);
+                            // For less confusing error messages, let the resolution be handled by Vike or Node.js.
                             importPathTranspiled = importPathOriginal;
                         }
                     }
                     if (debug.isActivated)
                         debug('onResolved()', { args, resolved, importPathTranspiled, isPointerImport, isExternal });
-                    if (isExternal) {
-                        pointerImports[importPathTranspiled] = isPointerImport;
-                        return { external: true, path: importPathTranspiled };
-                    }
-                    else {
-                        return resolved;
-                    }
+                    assert(isExternal);
+                    assert(
+                    // Import of runtime code => handled by Vike
+                    isPointerImport ||
+                        // Import of config code => loaded by Node.js at build-time
+                        isNodeModules);
+                    pointerImports[importPathTranspiled] = isPointerImport;
+                    return { external: true, path: importPathTranspiled };
                 });
             }
         },

package/dist/esm/node/plugin/plugins/importUserCode/v1-design/getVikeConfig.js

@@ -237,7 +237,7 @@ async function loadVikeConfig(userRootDir, outDirRoot, isDev, crawlWithGit) {
     const importedFilesLoaded = {};
     const { globalVikeConfig, pageConfigGlobal } = await getGlobalConfigs(interfaceFilesByLocationId, userRootDir, importedFilesLoaded);
     const pageConfigs = await Promise.all(objectEntries(interfaceFilesByLocationId)
-        .filter(([_pageId, interfaceFiles]) => isDefiningPage(interfaceFiles))
+        .filter(([pageId, interfaceFiles]) => isDefiningPage(interfaceFiles))
         .map(async ([locationId]) => {
         const interfaceFilesRelevant = getInterfaceFilesRelevant(interfaceFilesByLocationId, locationId);
         const interfaceFilesRelevantList = Object.values(interfaceFilesRelevant).flat(1);

package/dist/esm/node/prerender/runPrerender.js

@@ -278,7 +278,7 @@ async function handlePagesWithStaticRoutes(prerenderContext, renderContext, doNo
         objectAssign(pageContext, {
             _providedByHook: null,
             routeParams,
-            _pageId: pageId,
+            pageId: pageId,
             _debugRouteMatches: [
                 {
                     pageId,
@@ -441,8 +441,8 @@ async function routeAndPrerender(prerenderContext, concurrencyLimit, onComplete)
         const { urlOriginal } = pageContext;
         assert(urlOriginal);
         const pageContextFromRoute = await route(pageContext);
-        assert(hasProp(pageContextFromRoute, '_pageId', 'null') || hasProp(pageContextFromRoute, '_pageId', 'string'));
-        if (pageContextFromRoute._pageId === null) {
+        assert(hasProp(pageContextFromRoute, 'pageId', 'null') || hasProp(pageContextFromRoute, 'pageId', 'string'));
+        if (pageContextFromRoute.pageId === null) {
             let hookName;
             let hookFilePath;
             if (pageContext._providedByHook) {
@@ -464,9 +464,9 @@ async function routeAndPrerender(prerenderContext, concurrencyLimit, onComplete)
                 return;
             }
         }
-        assert(pageContextFromRoute._pageId);
+        assert(pageContextFromRoute.pageId);
         objectAssign(pageContext, pageContextFromRoute);
-        const { _pageId: pageId } = pageContext;
+        const { pageId: pageId } = pageContext;
         objectAssign(pageContext, await loadUserFilesServerSide(pageContext));
         let usesClientRouter;
         {

package/dist/esm/node/runtime/html/injectAssets/getHtmlTags.js

@@ -14,7 +14,7 @@ function getHtmlTags(pageContext, streamFromReactStreamingPackage, injectFilter,
     assert([true, false].includes(pageContext._isHtmlOnly));
     const isHtmlOnly = pageContext._isHtmlOnly;
     const { isProduction } = getGlobalContext();
-    const injectScriptsAt = getInjectScriptsAt(pageContext._pageId, pageContext._pageConfigs);
+    const injectScriptsAt = getInjectScriptsAt(pageContext.pageId, pageContext._pageConfigs);
     const injectFilterEntries = pageAssets
         .filter((asset) => {
         if (asset.isEntry && asset.assetType === 'script') {

package/dist/esm/node/runtime/html/injectAssets/injectAssets__public.js

@@ -14,7 +14,7 @@ async function injectAssets__public(htmlString, pageContext) {
     assertUsage(hasProp(pageContext, 'urlPathname', 'string'), errMsg('`pageContext.urlPathname` should be a string'), {
         showStackTrace: true
     });
-    assertUsage(hasProp(pageContext, '_pageId', 'string'), errMsg('`pageContext._pageId` should be a string'), {
+    assertUsage(hasProp(pageContext, 'pageId', 'string'), errMsg('`pageContext.pageId` should be a string'), {
         showStackTrace: true
     });
     assertUsage(hasProp(pageContext, '__getPageAssets'), errMsg('`pageContext.__getPageAssets` is missing'), {

package/dist/esm/node/runtime/html/injectAssets.d.ts

@@ -11,7 +11,7 @@ import type { PageContextSerialization } from './serializePageContextClientSide.
 type PageContextInjectAssets = {
     urlPathname: string;
     __getPageAssets: () => Promise<PageAsset[]>;
-    _pageId: string;
+    pageId: string;
     _isHtmlOnly: boolean;
     _pageContextPromise: PageContextPromise;
     _renderHook: {

package/dist/esm/node/runtime/html/serializePageContextClientSide.d.ts

@@ -4,7 +4,7 @@ export type { PageContextSerialization };
 import type { PageConfigRuntime } from '../../../shared/page-configs/PageConfig.js';
 import type { UrlRedirect } from '../../../shared/route/abort.js';
 type PageContextSerialization = {
-    _pageId: string;
+    pageId: string;
     routeParams: Record<string, string>;
     _passToClient: string[];
     _pageConfigs: PageConfigRuntime[];

package/dist/esm/node/runtime/html/serializePageContextClientSide.js

@@ -18,7 +18,7 @@ const PASS_TO_CLIENT = [
     '_abortCaller',
     */
     pageContextInitIsPassedToClient,
-    '_pageId',
+    'pageId',
     'routeParams',
     'data' // for data() hook
 ];
@@ -95,7 +95,7 @@ function serialize(value, varName) {
 }
 function getPassToClient(pageContext) {
     let passToClient = [...pageContext._passToClient, ...PASS_TO_CLIENT];
-    if (isErrorPage(pageContext._pageId, pageContext._pageConfigs)) {
+    if (isErrorPage(pageContext.pageId, pageContext._pageConfigs)) {
         assert(hasProp(pageContext, 'is404', 'boolean'));
         addIs404ToPageProps(pageContext);
         passToClient.push(...PASS_TO_CLIENT_ERROR_PAGE);

package/dist/esm/node/runtime/renderPage/createHttpResponse.d.ts

@@ -20,7 +20,7 @@ type HttpResponse = {
     contentType: 'application/json' | 'text/html;charset=utf-8';
 } & HttpResponseBody;
 declare function createHttpResponsePage(htmlRender: HtmlRender, renderHook: null | RenderHook, pageContext: {
-    _pageId: null | string;
+    pageId: null | string;
     is404: null | boolean;
     errorWhileRendering: null | Error;
     __getPageAssets: GetPageAssets;

package/dist/esm/node/runtime/renderPage/createHttpResponse.js

@@ -12,7 +12,7 @@ import { assertNoInfiniteHttpRedirect } from './createHttpResponse/assertNoInfin
 async function createHttpResponsePage(htmlRender, renderHook, pageContext) {
     let statusCode = pageContext.abortStatusCode;
     if (!statusCode) {
-        const isError = !pageContext._pageId || isErrorPage(pageContext._pageId, pageContext._pageConfigs);
+        const isError = !pageContext.pageId || isErrorPage(pageContext.pageId, pageContext._pageConfigs);
         if (pageContext.errorWhileRendering) {
             assert(isError);
         }
@@ -27,8 +27,8 @@ async function createHttpResponsePage(htmlRender, renderHook, pageContext) {
     }
     const earlyHints = getEarlyHints(await pageContext.__getPageAssets());
     const headers = [];
-    assert(pageContext._pageId);
-    const cacheControl = getCacheControl(pageContext._pageId, pageContext._pageConfigs);
+    assert(pageContext.pageId);
+    const cacheControl = getCacheControl(pageContext.pageId, pageContext._pageConfigs);
     if (cacheControl) {
         headers.push(['Cache-Control', cacheControl]);
     }