vike 0.4.233 → 0.4.235

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

@@ -165,9 +165,26 @@ async function getHtmlTags(pageContext, streamFromReactStreamingPackage, injectF
 }
 function mergeScriptEntries(pageAssets, viteDevScript) {
     const scriptEntries = pageAssets.filter((pageAsset) => pageAsset.isEntry && pageAsset.assetType === 'script');
-    const scriptTagsHtml = `${viteDevScript}${scriptEntries.map((asset) => (0, inferHtmlTags_js_1.inferAssetTag)(asset)).join('')}`;
-    const scriptTag = (0, mergeScriptTags_js_1.mergeScriptTags)(scriptTagsHtml);
-    return scriptTag;
+    let scriptEntry = `${viteDevScript}${scriptEntries.map((asset) => (0, inferHtmlTags_js_1.inferAssetTag)(asset)).join('')}`;
+    // We merge scripts to avoid the infamous HMR preamble error.
+    // - Infamous HMR preamble error:
+    //   ```browser-console
+    //   usePageContext.tsx:10 Uncaught (in promise) Error: @vitejs/plugin-react can't detect preamble. Something is wrong.
+    //       at usePageContext.tsx:10:10
+    //   ```
+    // - Note the following race condition. Maybe making the second script non-async ensures execution order?
+    //   ```html
+    //   <script type="module">console.log("I can be printed *after* the other log")</script>
+    //   <script src="entry.js" type="module" async></script>
+    //   ```
+    //   ```js
+    //   // entry.js
+    //   console.log("I can be printed *before* the other log")
+    //   ```
+    // - Maybe an alternative would be to make Vike's client runtime entry <script> tag non-async. Would that work? Would it be a performance issue?
+    //   - The entry <script> shouldn't be `<script defer>` upon HTML streaming, otherwise progressive hydration while SSR streaming won't work.
+    scriptEntry = (0, mergeScriptTags_js_1.mergeScriptTags)(scriptEntry);
+    return scriptEntry;
 }
 function getPageContextJsonScriptTag(pageContext) {
     const pageContextClientSerialized = (0, sanitizeJson_js_1.sanitizeJson)((0, serializeContext_js_1.getPageContextClientSerialized)(pageContext));

package/dist/cjs/node/runtime/html/injectAssets/mergeScriptTags.js

@@ -21,7 +21,13 @@ function mergeScriptTags(scriptTagsHtml) {
                 const hasInnerHtml = !!innerHtml.trim();
                 if (src) {
                     (0, utils_js_1.assert)(!hasInnerHtml);
-                    contents.push(`import ${JSON.stringify(src)};`);
+                    // - We don't use a static import because static imports are hoisted => React's HMR preamble can be executed after user land code => triggering this error:
+                    //   ```
+                    //   [22:28:57.885][/test-dev.test.ts][pnpm run dev][Browser Error] Error: @vitejs/plugin-react-swc can't detect preamble. Something is wrong.
+                    //       at http://localhost:3000/@fs/home/rom/code/docpress/src/renderer/usePageContext.tsx:9:11
+                    //   ```
+                    // - We don't use `await` the dynamic import() to avoid waterfall
+                    contents.push(`import(${JSON.stringify(src)});`);
                 }
                 else if (hasInnerHtml) {
                     innerHtml = innerHtml.split('\n').filter(Boolean).join('\n');

package/dist/cjs/node/vite/plugins/pluginVirtualFiles.js

@@ -73,28 +73,33 @@ function handleFileAddRemove(server, config) {
         if ((0, transpileAndExecuteFile_js_1.isTemporaryBuildFile)(file))
             return;
         const { moduleGraph } = server;
-        const isVikeConfig = await isVikeConfigDependency(file, moduleGraph);
+        const isVikeConfigDep = await isVikeConfigDependency(file, moduleGraph);
         const reload = () => reloadConfig(file, config, isRemove ? 'removed' : 'created', server);
-        if (isVikeConfig) {
-            if (isVikeConfig.isNotProcessedByVite) {
-                reload();
-            }
-            else {
-                // Let Vite handle it
-                (0, utils_js_1.assert)(existsInViteModuleGraph(file, moduleGraph));
-            }
+        // Config code
+        if (isVikeConfigDep && !isVikeConfigDep.isProcessedByVite) {
+            reload();
+            return;
         }
-        else {
-            // Trick: when importing a file that doesn't exist => we don't know whether `file` is that missing file => we take a leap of faith when the conditions below are met.
-            // - Not sure how reliable that trick is.
-            // - Reloading Vike's config is cheap and file creation/removal is rare => the trick is worth it.
-            // - Reproduction:
-            //   ```bash
-            //   rm someDep.js && sleep 2 && git checkout someDep.js
-            //   ```
-            if ((0, utils_js_1.isScriptFile)(file) && (0, getVikeConfigError_js_1.getVikeConfigError)() && !existsInViteModuleGraph(file, moduleGraph)) {
-                reload();
-            }
+        // New or deleted + file
+        if ((0, crawlPlusFiles_js_1.isPlusFile)(file)) {
+            reload();
+            return;
+        }
+        // Runtime code => let Vite handle it
+        if (isVikeConfigDep && isVikeConfigDep.isProcessedByVite) {
+            (0, utils_js_1.assert)(existsInViteModuleGraph(file, moduleGraph));
+            return;
+        }
+        // Trick: when importing a file that doesn't exist => we don't know whether `file` is that missing file => we take a leap of faith when the conditions below are met.
+        // - Not sure how reliable that trick is.
+        // - Reloading Vike's config is cheap and file creation/removal is rare => the trick is worth it.
+        // - Reproduction:
+        //   ```bash
+        //   rm someDep.js && sleep 2 && git checkout someDep.js
+        //   ```
+        if ((0, utils_js_1.isScriptFile)(file) && (0, getVikeConfigError_js_1.getVikeConfigError)() && !existsInViteModuleGraph(file, moduleGraph)) {
+            reload();
+            return;
         }
     }
 }
@@ -107,9 +112,9 @@ function invalidateVikeVirtualFiles(server) {
 // Vite calls its hook handleHotUpdate() whenever *any file* is modified — including files that aren't in Vite's module graph such as `pages/+config.js`
 async function handleHotUpdate(ctx, config) {
     const { file, server } = ctx;
-    const isVikeConfig = await isVikeConfigDependency(ctx.file, ctx.server.moduleGraph);
-    if (isVikeConfig) {
-        if (isVikeConfig.isNotProcessedByVite) {
+    const isVikeConfigDep = await isVikeConfigDependency(ctx.file, ctx.server.moduleGraph);
+    if (isVikeConfigDep) {
+        if (!isVikeConfigDep.isProcessedByVite) {
             /* Tailwind breaks this assertion, see https://github.com/vikejs/vike/discussions/1330#discussioncomment-7787238
             const isViteModule = ctx.modules.length > 0
             assert(!isViteModule)
@@ -139,7 +144,7 @@ async function isVikeConfigDependency(filePathAbsoluteFilesystem, moduleGraph) {
         const { _vikeConfigDependencies: vikeConfigDependencies } = vikeConfigObject;
         vikeConfigDependencies.forEach((f) => (0, utils_js_1.assertPosixPath)(f));
         if (vikeConfigDependencies.has(filePathAbsoluteFilesystem))
-            return { isNotProcessedByVite: true };
+            return { isProcessedByVite: false };
     }
     // Runtime Vike config files such as +data.js which are processed by Vite.
     // - They're included in Vite's module graph.
@@ -148,7 +153,7 @@ async function isVikeConfigDependency(filePathAbsoluteFilesystem, moduleGraph) {
     const importers = getImporters(filePathAbsoluteFilesystem, moduleGraph);
     const isPlusValueFileDependency = Array.from(importers).some((importer) => importer.file && (0, crawlPlusFiles_js_1.isPlusFile)(importer.file));
     if (isPlusValueFileDependency)
-        return { isNotProcessedByVite: false };
+        return { isProcessedByVite: true };
     return null;
 }
 function reloadConfig(filePath, config, op, server) {

package/dist/cjs/utils/PROJECT_VERSION.js

@@ -2,4 +2,4 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.PROJECT_VERSION = void 0;
 // Automatically updated by @brillout/release-me
-exports.PROJECT_VERSION = '0.4.233';
+exports.PROJECT_VERSION = '0.4.235';

package/dist/esm/client/runtime-client-routing/renderPageClientSide.d.ts

@@ -156,7 +156,7 @@ declare function getPageContextBegin(isForErrorPage: boolean, { urlOriginal, isB
 declare global {
     var _vike: {
         fullyRenderedUrl?: string;
-    };
+    } | undefined;
 }
 declare function disableClientRouting(err: unknown, log: boolean): void;
 declare function getRenderCount(): number;

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

@@ -160,9 +160,26 @@ async function getHtmlTags(pageContext, streamFromReactStreamingPackage, injectF
 }
 function mergeScriptEntries(pageAssets, viteDevScript) {
     const scriptEntries = pageAssets.filter((pageAsset) => pageAsset.isEntry && pageAsset.assetType === 'script');
-    const scriptTagsHtml = `${viteDevScript}${scriptEntries.map((asset) => inferAssetTag(asset)).join('')}`;
-    const scriptTag = mergeScriptTags(scriptTagsHtml);
-    return scriptTag;
+    let scriptEntry = `${viteDevScript}${scriptEntries.map((asset) => inferAssetTag(asset)).join('')}`;
+    // We merge scripts to avoid the infamous HMR preamble error.
+    // - Infamous HMR preamble error:
+    //   ```browser-console
+    //   usePageContext.tsx:10 Uncaught (in promise) Error: @vitejs/plugin-react can't detect preamble. Something is wrong.
+    //       at usePageContext.tsx:10:10
+    //   ```
+    // - Note the following race condition. Maybe making the second script non-async ensures execution order?
+    //   ```html
+    //   <script type="module">console.log("I can be printed *after* the other log")</script>
+    //   <script src="entry.js" type="module" async></script>
+    //   ```
+    //   ```js
+    //   // entry.js
+    //   console.log("I can be printed *before* the other log")
+    //   ```
+    // - Maybe an alternative would be to make Vike's client runtime entry <script> tag non-async. Would that work? Would it be a performance issue?
+    //   - The entry <script> shouldn't be `<script defer>` upon HTML streaming, otherwise progressive hydration while SSR streaming won't work.
+    scriptEntry = mergeScriptTags(scriptEntry);
+    return scriptEntry;
 }
 function getPageContextJsonScriptTag(pageContext) {
     const pageContextClientSerialized = sanitizeJson(getPageContextClientSerialized(pageContext));

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

@@ -19,7 +19,13 @@ function mergeScriptTags(scriptTagsHtml) {
                 const hasInnerHtml = !!innerHtml.trim();
                 if (src) {
                     assert(!hasInnerHtml);
-                    contents.push(`import ${JSON.stringify(src)};`);
+                    // - We don't use a static import because static imports are hoisted => React's HMR preamble can be executed after user land code => triggering this error:
+                    //   ```
+                    //   [22:28:57.885][/test-dev.test.ts][pnpm run dev][Browser Error] Error: @vitejs/plugin-react-swc can't detect preamble. Something is wrong.
+                    //       at http://localhost:3000/@fs/home/rom/code/docpress/src/renderer/usePageContext.tsx:9:11
+                    //   ```
+                    // - We don't use `await` the dynamic import() to avoid waterfall
+                    contents.push(`import(${JSON.stringify(src)});`);
                 }
                 else if (hasInnerHtml) {
                     innerHtml = innerHtml.split('\n').filter(Boolean).join('\n');

package/dist/esm/node/vite/plugins/pluginVirtualFiles.js

@@ -68,28 +68,33 @@ function handleFileAddRemove(server, config) {
         if (isTemporaryBuildFile(file))
             return;
         const { moduleGraph } = server;
-        const isVikeConfig = await isVikeConfigDependency(file, moduleGraph);
+        const isVikeConfigDep = await isVikeConfigDependency(file, moduleGraph);
         const reload = () => reloadConfig(file, config, isRemove ? 'removed' : 'created', server);
-        if (isVikeConfig) {
-            if (isVikeConfig.isNotProcessedByVite) {
-                reload();
-            }
-            else {
-                // Let Vite handle it
-                assert(existsInViteModuleGraph(file, moduleGraph));
-            }
+        // Config code
+        if (isVikeConfigDep && !isVikeConfigDep.isProcessedByVite) {
+            reload();
+            return;
         }
-        else {
-            // Trick: when importing a file that doesn't exist => we don't know whether `file` is that missing file => we take a leap of faith when the conditions below are met.
-            // - Not sure how reliable that trick is.
-            // - Reloading Vike's config is cheap and file creation/removal is rare => the trick is worth it.
-            // - Reproduction:
-            //   ```bash
-            //   rm someDep.js && sleep 2 && git checkout someDep.js
-            //   ```
-            if (isScriptFile(file) && getVikeConfigError() && !existsInViteModuleGraph(file, moduleGraph)) {
-                reload();
-            }
+        // New or deleted + file
+        if (isPlusFile(file)) {
+            reload();
+            return;
+        }
+        // Runtime code => let Vite handle it
+        if (isVikeConfigDep && isVikeConfigDep.isProcessedByVite) {
+            assert(existsInViteModuleGraph(file, moduleGraph));
+            return;
+        }
+        // Trick: when importing a file that doesn't exist => we don't know whether `file` is that missing file => we take a leap of faith when the conditions below are met.
+        // - Not sure how reliable that trick is.
+        // - Reloading Vike's config is cheap and file creation/removal is rare => the trick is worth it.
+        // - Reproduction:
+        //   ```bash
+        //   rm someDep.js && sleep 2 && git checkout someDep.js
+        //   ```
+        if (isScriptFile(file) && getVikeConfigError() && !existsInViteModuleGraph(file, moduleGraph)) {
+            reload();
+            return;
         }
     }
 }
@@ -102,9 +107,9 @@ function invalidateVikeVirtualFiles(server) {
 // Vite calls its hook handleHotUpdate() whenever *any file* is modified — including files that aren't in Vite's module graph such as `pages/+config.js`
 async function handleHotUpdate(ctx, config) {
     const { file, server } = ctx;
-    const isVikeConfig = await isVikeConfigDependency(ctx.file, ctx.server.moduleGraph);
-    if (isVikeConfig) {
-        if (isVikeConfig.isNotProcessedByVite) {
+    const isVikeConfigDep = await isVikeConfigDependency(ctx.file, ctx.server.moduleGraph);
+    if (isVikeConfigDep) {
+        if (!isVikeConfigDep.isProcessedByVite) {
             /* Tailwind breaks this assertion, see https://github.com/vikejs/vike/discussions/1330#discussioncomment-7787238
             const isViteModule = ctx.modules.length > 0
             assert(!isViteModule)
@@ -134,7 +139,7 @@ async function isVikeConfigDependency(filePathAbsoluteFilesystem, moduleGraph) {
         const { _vikeConfigDependencies: vikeConfigDependencies } = vikeConfigObject;
         vikeConfigDependencies.forEach((f) => assertPosixPath(f));
         if (vikeConfigDependencies.has(filePathAbsoluteFilesystem))
-            return { isNotProcessedByVite: true };
+            return { isProcessedByVite: false };
     }
     // Runtime Vike config files such as +data.js which are processed by Vite.
     // - They're included in Vite's module graph.
@@ -143,7 +148,7 @@ async function isVikeConfigDependency(filePathAbsoluteFilesystem, moduleGraph) {
     const importers = getImporters(filePathAbsoluteFilesystem, moduleGraph);
     const isPlusValueFileDependency = Array.from(importers).some((importer) => importer.file && isPlusFile(importer.file));
     if (isPlusValueFileDependency)
-        return { isNotProcessedByVite: false };
+        return { isProcessedByVite: true };
     return null;
 }
 function reloadConfig(filePath, config, op, server) {

package/dist/esm/utils/PROJECT_VERSION.d.ts

@@ -1 +1 @@
-export declare const PROJECT_VERSION: "0.4.233";
+export declare const PROJECT_VERSION: "0.4.235";

package/dist/esm/utils/PROJECT_VERSION.js

@@ -1,2 +1,2 @@
 // Automatically updated by @brillout/release-me
-export const PROJECT_VERSION = '0.4.233';
+export const PROJECT_VERSION = '0.4.235';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vike",
-  "version": "0.4.233",
+  "version": "0.4.235",
   "repository": "https://github.com/vikejs/vike",
   "exports": {
     "./server": {