@marko/vite 2.4.4 → 2.4.6

package/dist/{chunk-ZCKVZIQN.mjs → chunk-2E5QX7AF.mjs}

@@ -1,6 +1,6 @@
 import {
   serialize
-} from "./chunk-BV667Z5U.mjs";
+} from "./chunk-NTHVNXFC.mjs";
 
 // src/manifest-generator.ts
 import { Parser } from "htmlparser2";
@@ -15,6 +15,7 @@ function generateDocManifest(basePath, rawHtml) {
           return reject(err);
         }
         const htmlChildren = dom.find(isElement).childNodes;
+        const entries = [];
         const headPrepend = [];
         const head = [];
         const bodyPrepend = [];
@@ -34,10 +35,11 @@ function generateDocManifest(basePath, rawHtml) {
           body
         );
         resolve({
-          "head-prepend": serializeOrNull(basePath, headPrepend),
-          head: serializeOrNull(basePath, head),
-          "body-prepend": serializeOrNull(basePath, bodyPrepend),
-          body: serializeOrNull(basePath, body)
+          entries,
+          "head-prepend": serializeOrNull(basePath, headPrepend, entries),
+          head: serializeOrNull(basePath, head, entries),
+          "body-prepend": serializeOrNull(basePath, bodyPrepend, entries),
+          body: serializeOrNull(basePath, body, entries)
         });
       })
     );
@@ -50,8 +52,8 @@ function generateInputDoc(entry) {
     entry
   )}></script></body></html>`;
 }
-function serializeOrNull(basePath, nodes) {
-  const result = serialize(basePath, nodes);
+function serializeOrNull(basePath, nodes, entries) {
+  const result = serialize(basePath, nodes, entries);
   if (result.length) {
     return result;
   }

package/dist/{chunk-BV667Z5U.mjs → chunk-NTHVNXFC.mjs}

@@ -16,7 +16,7 @@ var voidElements = /* @__PURE__ */ new Set([
   "track",
   "wbr"
 ]);
-function serialize(basePath, nodes, parts) {
+function serialize(basePath, nodes, entries, parts) {
   let curString = parts ? parts.pop() : "";
   parts ?? (parts = []);
   for (const node of nodes) {
@@ -50,11 +50,15 @@ function serialize(basePath, nodes, parts) {
           if (attr.value === "") {
             curString += ` ${attr.name}`;
           } else if (attr.name === urlAttr) {
+            const id = stripBasePath(basePath, attr.value).replace(/^\.\//, "");
+            if (tag.name === "script") {
+              entries.push(id);
+            }
             curString += ` ${attr.name}="`;
             parts.push(
               curString,
               1 /* PublicPath */,
-              stripBasePath(basePath, attr.value).replace(/"/g, "'").replace(/^\.\//, "") + '"'
+              id.replace(/"/g, "'") + '"'
             );
             curString = "";
           } else {
@@ -64,7 +68,7 @@ function serialize(basePath, nodes, parts) {
         curString += ">";
         if (tag.children.length) {
           parts.push(curString);
-          serialize(basePath, tag.children, parts);
+          serialize(basePath, tag.children, entries, parts);
           curString = parts.pop();
         }
         if (!voidElements.has(name)) {

package/dist/components/vite.marko

@@ -8,11 +8,35 @@ static function renderAssets(slot) {
     const writtenEntries = (this[slotWrittenEntriesKey] = entries.length);
 
     for (let i = lastWrittenEntry; i < writtenEntries; i++) {
-      const entry = entries[i];
-      const parts =
-        typeof __MARKO_MANIFEST__ === "object"
-          ? __MARKO_MANIFEST__[entry]?.[slot]
-          : entry[slot];
+      let entry = entries[i];
+
+      if (typeof __MARKO_MANIFEST__ === "object") {
+        entry = __MARKO_MANIFEST__[entry] || {};
+      } else if (slot === "head") {
+        // In dev mode we have is a list entries of the top level modules that need to be imported.
+        // To avoid FOUC we will hide the page until all of these modules are loaded.
+        const { entries } = entry;
+        if (entries) {
+          let sep = "";
+          html += `<script${this.___viteInjectAttrs}>((root=document.documentElement)=>{`;
+          html += "root.style.visibility='hidden';";
+          html += "document.currentScript.remove();";
+          html += "Promise.allSettled([";
+
+          for (const id of entries) {
+            html += `${sep}import(${JSON.stringify(this.___viteBasePath + id)})`;
+            sep = ",";
+          }
+
+          html += "]).then(()=>{";
+          html += "root.style.visibility='';";
+          html +=
+            "if(root.getAttribute('style')==='')root.removeAttribute('style')";
+          html += "})})()</script>";
+        }
+      }
+
+      const parts = entry[slot];
 
       if (parts) {
         for (const part of parts) {
@@ -40,7 +64,9 @@ $ if (!out.global.___viteRenderAssets) {
 <__flush_here_and_after__>
   <if(input.base && !out.global.___flushedMBP)>
     $ out.global.___flushedMBP = true;
-    $!{`<script${out.global.___viteInjectAttrs}>${out.global.___viteBaseVar}=${JSON.stringify(input.base)}</script>`}
+    $!{`<script${out.global.___viteInjectAttrs}>${
+      out.global.___viteBaseVar
+    }=${JSON.stringify(input.base)}</script>`}
   </if>
   $!{out.global.___viteRenderAssets(input.slot)}
 </__flush_here_and_after__>

package/dist/index.js

@@ -52,6 +52,7 @@ const queryReg = /\?marko-.+$/;
 const browserEntryQuery = "?marko-browser-entry";
 const serverEntryQuery = "?marko-server-entry";
 const virtualFileQuery = "?marko-virtual";
+const browserQuery = "?marko-browser";
 const manifestFileName = "manifest.json";
 const markoExt = ".marko";
 const htmlExt = ".html";
@@ -94,7 +95,8 @@ function markoPlugin(opts = {}) {
   let store;
   let CJSTemplates;
   let basePath = "/";
-  const entrySources = /* @__PURE__ */ new Map();
+  const entryIds = /* @__PURE__ */ new Set();
+  const cachedSources = /* @__PURE__ */ new Map();
   const transformWatchFiles = /* @__PURE__ */ new Map();
   const transformOptionalFiles = /* @__PURE__ */ new Map();
   return [
@@ -238,8 +240,9 @@ function markoPlugin(opts = {}) {
         ssrConfig.hot = domConfig.hot = true;
         devServer = _server;
         devServer.watcher.on("all", (type, filename) => {
+          cachedSources.delete(filename);
           if (type === "unlink") {
-            entrySources.delete(filename);
+            entryIds.delete(filename);
             transformWatchFiles.delete(filename);
             transformOptionalFiles.delete(filename);
           }
@@ -274,10 +277,9 @@ function markoPlugin(opts = {}) {
             );
             inputOptions.input = toHTMLEntries(root, serverManifest.entries);
             for (const entry in serverManifest.entrySources) {
-              entrySources.set(
-                normalizePath(import_path.default.resolve(root, entry)),
-                serverManifest.entrySources[entry]
-              );
+              const id = normalizePath(import_path.default.resolve(root, entry));
+              entryIds.add(id);
+              cachedSources.set(id, serverManifest.entrySources[entry]);
             }
           } catch (err) {
             this.error(
@@ -302,6 +304,8 @@ function markoPlugin(opts = {}) {
           importeeQuery = serverEntryQuery;
         } else if (!ssr && isBuild && importer && isMarkoFile(importee) && ((_a = this.getModuleInfo(importer)) == null ? void 0 : _a.isEntry)) {
           importeeQuery = browserEntryQuery;
+        } else if (linked && !ssr && !importeeQuery && isMarkoFile(importee)) {
+          importeeQuery = browserQuery;
         }
         if (importeeQuery) {
           const resolved = importee[0] === "." ? {
@@ -331,11 +335,12 @@ function markoPlugin(opts = {}) {
         return null;
       },
       async load(id) {
-        switch (getMarkoQuery(id)) {
+        const query = getMarkoQuery(id);
+        switch (query) {
           case serverEntryQuery: {
-            const fileName = id.slice(0, -serverEntryQuery.length);
+            const fileName = id.slice(0, -query.length);
             let entryData;
-            entrySources.set(fileName, "");
+            entryIds.add(fileName);
             if (isBuild) {
               const relativeFileName = import_path.default.posix.relative(root, fileName);
               const entryId = toEntryId(relativeFileName);
@@ -364,8 +369,9 @@ function markoPlugin(opts = {}) {
               basePathVar: isBuild ? basePathVar : void 0
             });
           }
-          case browserEntryQuery: {
-            return entrySources.get(id.slice(0, -browserEntryQuery.length));
+          case browserEntryQuery:
+          case browserQuery: {
+            return cachedSources.get(id.slice(0, -query.length)) || null;
           }
         }
         return virtualFiles.get(id) || null;
@@ -391,24 +397,26 @@ function markoPlugin(opts = {}) {
         if (!isMarkoFile(id)) {
           return null;
         }
-        if (CJSTemplates == null ? void 0 : CJSTemplates.has(id)) {
-          return createEsmWrapper(
-            id,
-            getExportIdentifiers(
-              (await compiler.compile(source, id, {
-                cache,
-                ast: true,
-                code: false,
-                output: "source",
-                sourceMaps: false
-              })).ast
-            )
-          );
-        }
-        if (isSSR && linked && entrySources.has(id)) {
-          entrySources.set(id, source);
-          if (serverManifest) {
-            serverManifest.entrySources[import_path.default.posix.relative(root, id)] = source;
+        if (isSSR) {
+          if (linked) {
+            cachedSources.set(id, source);
+            if (serverManifest && entryIds.has(id)) {
+              serverManifest.entrySources[import_path.default.posix.relative(root, id)] = source;
+            }
+          }
+          if (CJSTemplates == null ? void 0 : CJSTemplates.has(id)) {
+            return createEsmWrapper(
+              id,
+              getExportIdentifiers(
+                (await compiler.compile(source, id, {
+                  cache,
+                  ast: true,
+                  code: false,
+                  output: "source",
+                  sourceMaps: false
+                })).ast
+              )
+            );
           }
         }
         const compiled = await compiler.compile(
@@ -485,10 +493,14 @@ if (import.meta.hot) import.meta.hot.accept(() => {});`;
               chunk = bundle[chunkId];
             }
             if ((chunk == null ? void 0 : chunk.type) === "asset") {
-              browserManifest[entryId] = await (0, import_manifest_generator.generateDocManifest)(
-                basePath,
-                chunk.source.toString()
-              );
+              browserManifest[entryId] = {
+                ...await (0, import_manifest_generator.generateDocManifest)(
+                  basePath,
+                  chunk.source.toString()
+                ),
+                entries: void 0
+                // clear out entries for prod builds.
+              };
               delete bundle[chunkId];
             } else {
               this.error(

package/dist/index.mjs

@@ -4,8 +4,8 @@ import {
 import {
   generateDocManifest,
   generateInputDoc
-} from "./chunk-ZCKVZIQN.mjs";
-import "./chunk-BV667Z5U.mjs";
+} from "./chunk-2E5QX7AF.mjs";
+import "./chunk-NTHVNXFC.mjs";
 import {
   server_entry_template_default
 } from "./chunk-6IJ5UJ3N.mjs";
@@ -32,6 +32,7 @@ var queryReg = /\?marko-.+$/;
 var browserEntryQuery = "?marko-browser-entry";
 var serverEntryQuery = "?marko-server-entry";
 var virtualFileQuery = "?marko-virtual";
+var browserQuery = "?marko-browser";
 var manifestFileName = "manifest.json";
 var markoExt = ".marko";
 var htmlExt = ".html";
@@ -74,7 +75,8 @@ function markoPlugin(opts = {}) {
   let store;
   let CJSTemplates;
   let basePath = "/";
-  const entrySources = /* @__PURE__ */ new Map();
+  const entryIds = /* @__PURE__ */ new Set();
+  const cachedSources = /* @__PURE__ */ new Map();
   const transformWatchFiles = /* @__PURE__ */ new Map();
   const transformOptionalFiles = /* @__PURE__ */ new Map();
   return [
@@ -218,8 +220,9 @@ function markoPlugin(opts = {}) {
         ssrConfig.hot = domConfig.hot = true;
         devServer = _server;
         devServer.watcher.on("all", (type, filename) => {
+          cachedSources.delete(filename);
           if (type === "unlink") {
-            entrySources.delete(filename);
+            entryIds.delete(filename);
             transformWatchFiles.delete(filename);
             transformOptionalFiles.delete(filename);
           }
@@ -254,10 +257,9 @@ function markoPlugin(opts = {}) {
             );
             inputOptions.input = toHTMLEntries(root, serverManifest.entries);
             for (const entry in serverManifest.entrySources) {
-              entrySources.set(
-                normalizePath(path.resolve(root, entry)),
-                serverManifest.entrySources[entry]
-              );
+              const id = normalizePath(path.resolve(root, entry));
+              entryIds.add(id);
+              cachedSources.set(id, serverManifest.entrySources[entry]);
             }
           } catch (err) {
             this.error(
@@ -282,6 +284,8 @@ function markoPlugin(opts = {}) {
           importeeQuery = serverEntryQuery;
         } else if (!ssr && isBuild && importer && isMarkoFile(importee) && ((_a = this.getModuleInfo(importer)) == null ? void 0 : _a.isEntry)) {
           importeeQuery = browserEntryQuery;
+        } else if (linked && !ssr && !importeeQuery && isMarkoFile(importee)) {
+          importeeQuery = browserQuery;
         }
         if (importeeQuery) {
           const resolved = importee[0] === "." ? {
@@ -311,11 +315,12 @@ function markoPlugin(opts = {}) {
         return null;
       },
       async load(id) {
-        switch (getMarkoQuery(id)) {
+        const query = getMarkoQuery(id);
+        switch (query) {
           case serverEntryQuery: {
-            const fileName = id.slice(0, -serverEntryQuery.length);
+            const fileName = id.slice(0, -query.length);
             let entryData;
-            entrySources.set(fileName, "");
+            entryIds.add(fileName);
             if (isBuild) {
               const relativeFileName = path.posix.relative(root, fileName);
               const entryId = toEntryId(relativeFileName);
@@ -344,8 +349,9 @@ function markoPlugin(opts = {}) {
               basePathVar: isBuild ? basePathVar : void 0
             });
           }
-          case browserEntryQuery: {
-            return entrySources.get(id.slice(0, -browserEntryQuery.length));
+          case browserEntryQuery:
+          case browserQuery: {
+            return cachedSources.get(id.slice(0, -query.length)) || null;
           }
         }
         return virtualFiles.get(id) || null;
@@ -371,24 +377,26 @@ function markoPlugin(opts = {}) {
         if (!isMarkoFile(id)) {
           return null;
         }
-        if (CJSTemplates == null ? void 0 : CJSTemplates.has(id)) {
-          return createEsmWrapper(
-            id,
-            getExportIdentifiers(
-              (await compiler.compile(source, id, {
-                cache,
-                ast: true,
-                code: false,
-                output: "source",
-                sourceMaps: false
-              })).ast
-            )
-          );
-        }
-        if (isSSR && linked && entrySources.has(id)) {
-          entrySources.set(id, source);
-          if (serverManifest) {
-            serverManifest.entrySources[path.posix.relative(root, id)] = source;
+        if (isSSR) {
+          if (linked) {
+            cachedSources.set(id, source);
+            if (serverManifest && entryIds.has(id)) {
+              serverManifest.entrySources[path.posix.relative(root, id)] = source;
+            }
+          }
+          if (CJSTemplates == null ? void 0 : CJSTemplates.has(id)) {
+            return createEsmWrapper(
+              id,
+              getExportIdentifiers(
+                (await compiler.compile(source, id, {
+                  cache,
+                  ast: true,
+                  code: false,
+                  output: "source",
+                  sourceMaps: false
+                })).ast
+              )
+            );
           }
         }
         const compiled = await compiler.compile(
@@ -465,10 +473,14 @@ if (import.meta.hot) import.meta.hot.accept(() => {});`;
               chunk = bundle[chunkId];
             }
             if ((chunk == null ? void 0 : chunk.type) === "asset") {
-              browserManifest[entryId] = await generateDocManifest(
-                basePath,
-                chunk.source.toString()
-              );
+              browserManifest[entryId] = {
+                ...await generateDocManifest(
+                  basePath,
+                  chunk.source.toString()
+                ),
+                entries: void 0
+                // clear out entries for prod builds.
+              };
               delete bundle[chunkId];
             } else {
               this.error(

package/dist/manifest-generator.d.ts

@@ -1,6 +1,7 @@
 import serialize from "./serializer";
 type SerializedOrNull = null | ReturnType<typeof serialize>;
 export interface DocManifest {
+    entries: string[];
     "head-prepend": SerializedOrNull;
     head: SerializedOrNull;
     "body-prepend": SerializedOrNull;

package/dist/manifest-generator.js

@@ -45,6 +45,7 @@ function generateDocManifest(basePath, rawHtml) {
           return reject(err);
         }
         const htmlChildren = dom.find(isElement).childNodes;
+        const entries = [];
         const headPrepend = [];
         const head = [];
         const bodyPrepend = [];
@@ -64,10 +65,11 @@ function generateDocManifest(basePath, rawHtml) {
           body
         );
         resolve({
-          "head-prepend": serializeOrNull(basePath, headPrepend),
-          head: serializeOrNull(basePath, head),
-          "body-prepend": serializeOrNull(basePath, bodyPrepend),
-          body: serializeOrNull(basePath, body)
+          entries,
+          "head-prepend": serializeOrNull(basePath, headPrepend, entries),
+          head: serializeOrNull(basePath, head, entries),
+          "body-prepend": serializeOrNull(basePath, bodyPrepend, entries),
+          body: serializeOrNull(basePath, body, entries)
         });
       })
     );
@@ -80,8 +82,8 @@ function generateInputDoc(entry) {
     entry
   )}></script></body></html>`;
 }
-function serializeOrNull(basePath, nodes) {
-  const result = (0, import_serializer.default)(basePath, nodes);
+function serializeOrNull(basePath, nodes, entries) {
+  const result = (0, import_serializer.default)(basePath, nodes, entries);
   if (result.length) {
     return result;
   }

package/dist/manifest-generator.mjs

@@ -1,8 +1,8 @@
 import {
   generateDocManifest,
   generateInputDoc
-} from "./chunk-ZCKVZIQN.mjs";
-import "./chunk-BV667Z5U.mjs";
+} from "./chunk-2E5QX7AF.mjs";
+import "./chunk-NTHVNXFC.mjs";
 export {
   generateDocManifest,
   generateInputDoc

package/dist/serializer.d.ts

@@ -3,5 +3,5 @@ declare enum InjectType {
     AssetAttrs = 0,
     PublicPath = 1
 }
-export default function serialize(basePath: string, nodes: Node[], parts?: (string | InjectType)[]): (string | InjectType)[];
+export default function serialize(basePath: string, nodes: Node[], entries: string[], parts?: (string | InjectType)[]): (string | InjectType)[];
 export {};

package/dist/serializer.js

@@ -43,7 +43,7 @@ const voidElements = /* @__PURE__ */ new Set([
   "track",
   "wbr"
 ]);
-function serialize(basePath, nodes, parts) {
+function serialize(basePath, nodes, entries, parts) {
   let curString = parts ? parts.pop() : "";
   parts ?? (parts = []);
   for (const node of nodes) {
@@ -77,11 +77,15 @@ function serialize(basePath, nodes, parts) {
           if (attr.value === "") {
             curString += ` ${attr.name}`;
           } else if (attr.name === urlAttr) {
+            const id = stripBasePath(basePath, attr.value).replace(/^\.\//, "");
+            if (tag.name === "script") {
+              entries.push(id);
+            }
             curString += ` ${attr.name}="`;
             parts.push(
               curString,
               1 /* PublicPath */,
-              stripBasePath(basePath, attr.value).replace(/"/g, "'").replace(/^\.\//, "") + '"'
+              id.replace(/"/g, "'") + '"'
             );
             curString = "";
           } else {
@@ -91,7 +95,7 @@ function serialize(basePath, nodes, parts) {
         curString += ">";
         if (tag.children.length) {
           parts.push(curString);
-          serialize(basePath, tag.children, parts);
+          serialize(basePath, tag.children, entries, parts);
           curString = parts.pop();
         }
         if (!voidElements.has(name)) {

package/dist/serializer.mjs

@@ -1,6 +1,6 @@
 import {
   serialize
-} from "./chunk-BV667Z5U.mjs";
+} from "./chunk-NTHVNXFC.mjs";
 export {
   serialize as default
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@marko/vite",
   "description": "A Marko plugin for Vite",
-  "version": "2.4.4",
+  "version": "2.4.6",
   "author": "Dylan Piercey <dpiercey@ebay.com>",
   "bugs": "https://github.com/marko-js/vite/issues",
   "dependencies": {