@marko/vite 2.0.1 → 2.2.0

package/dist/index.mjs

@@ -0,0 +1,408 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __reExport = (target, module, desc) => {
+  if (module && typeof module === "object" || typeof module === "function") {
+    for (let key of __getOwnPropNames(module))
+      if (!__hasOwnProp.call(target, key) && key !== "default")
+        __defProp(target, key, { get: () => module[key], enumerable: !(desc = __getOwnPropDesc(module, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toModule = (module) => {
+  return __reExport(__markAsModule(__defProp(module != null ? __create(__getProtoOf(module)) : {}, "default", module && module.__esModule && "default" in module ? { get: () => module.default, enumerable: true } : { value: module, enumerable: true })), module);
+};
+import os from "os";
+import fs from "fs";
+import path from "path";
+import crypto from "crypto";
+import { pathToFileURL } from "url";
+import anyMatch from "anymatch";
+import getServerEntryTemplate from "./server-entry-template";
+import {
+  generateInputDoc,
+  generateDocManifest
+} from "./manifest-generator";
+const virtualFiles = /* @__PURE__ */ new Map();
+const queryReg = /\?marko-.+$/;
+const browserEntryQuery = "?marko-browser-entry";
+const serverEntryQuery = "?marko-server-entry";
+const virtualFileQuery = "?marko-virtual";
+const markoExt = ".marko";
+const htmlExt = ".html";
+const resolveOpts = { skipSelf: true };
+let tempDir;
+function markoPlugin(opts = {}) {
+  var _a;
+  let compiler;
+  const { runtimeId, linked = true } = opts;
+  const baseConfig = {
+    runtimeId,
+    sourceMaps: true,
+    writeVersionComment: false,
+    cache: /* @__PURE__ */ new Map(),
+    babelConfig: __spreadProps(__spreadValues({}, opts.babelConfig), {
+      caller: __spreadValues({
+        name: "@marko/vite",
+        supportsStaticESM: true,
+        supportsDynamicImport: true,
+        supportsTopLevelAwait: true,
+        supportsExportNamespaceFrom: true
+      }, (_a = opts.babelConfig) == null ? void 0 : _a.caller)
+    })
+  };
+  const ssrConfig = __spreadProps(__spreadValues({}, baseConfig), {
+    output: "html"
+  });
+  const domConfig = __spreadProps(__spreadValues({}, baseConfig), {
+    resolveVirtualDependency(from, dep) {
+      const query = `${virtualFileQuery}&id=${dep.virtualPath}`;
+      const id = from + query;
+      if (devServer) {
+        const prev = virtualFiles.get(id);
+        if (prev && prev.code !== dep.code) {
+          devServer.moduleGraph.invalidateModule(devServer.moduleGraph.getModuleById(id));
+        }
+      }
+      virtualFiles.set(id, dep);
+      return `./${path.basename(from) + query}`;
+    },
+    output: "dom"
+  });
+  const hydrateConfig = __spreadProps(__spreadValues({}, domConfig), {
+    output: "hydrate"
+  });
+  let root;
+  let isBuild = false;
+  let isSSRBuild = false;
+  let devServer;
+  let registeredTag = false;
+  let serverManifest;
+  const transformWatchFiles = /* @__PURE__ */ new Map();
+  const transformOptionalFiles = /* @__PURE__ */ new Map();
+  return [
+    {
+      name: "marko-vite:pre",
+      enforce: "pre",
+      async config(config, env) {
+        var _a2, _b, _c, _d, _e;
+        compiler != null ? compiler : compiler = await Promise.resolve().then(() => __toModule(require(opts.compiler || "@marko/compiler")));
+        root = config.root || process.cwd();
+        isBuild = env.command === "build";
+        isSSRBuild = isBuild && linked && Boolean(config.build.ssr);
+        if (!registeredTag) {
+          const transformer = path.resolve(import.meta.url, "../render-assets-transform");
+          registeredTag = path.resolve(import.meta.url, "../components", isBuild ? "vite.marko" : "vite-watch.marko");
+          compiler.taglib.register("@marko/vite", {
+            "<_vite>": { template: registeredTag },
+            "<head>": { transformer },
+            "<body>": { transformer }
+          });
+        }
+        if (!isBuild) {
+          const lookup = compiler.taglib.buildLookup(root);
+          const domRuntimeDeps = compiler.getRuntimeEntryFiles("dom", opts.translator);
+          const htmlRuntimeDeps = compiler.getRuntimeEntryFiles("html", opts.translator);
+          const taglibDeps = [];
+          for (const name in lookup.taglibsById) {
+            const taglib = lookup.taglibsById[name];
+            if (/[\\/]node_modules[\\/](?!@marko[\\/])/.test(taglib.dirname)) {
+              for (const tagName in taglib.tags) {
+                const tag = taglib.tags[tagName];
+                const entry = tag.template || tag.renderer;
+                if (entry) {
+                  taglibDeps.push(entry.replace(/^.*?[\\/]node_modules[\\/]/, ""));
+                }
+              }
+            }
+          }
+          const domDeps = Array.from(new Set(domRuntimeDeps.concat(taglibDeps)));
+          const serverDeps = Array.from(new Set(htmlRuntimeDeps.concat(taglibDeps)));
+          const optimizeDeps = (_a2 = config.optimizeDeps) != null ? _a2 : config.optimizeDeps = {};
+          (_b = optimizeDeps.include) != null ? _b : optimizeDeps.include = [];
+          optimizeDeps.include = optimizeDeps.include.concat(domDeps.filter((dep) => path.extname(dep) !== markoExt));
+          (_c = optimizeDeps.exclude) != null ? _c : optimizeDeps.exclude = [];
+          optimizeDeps.exclude = optimizeDeps.exclude.concat(domDeps.filter((dep) => path.extname(dep) === markoExt));
+          const ssr = (_d = config.ssr) != null ? _d : config.ssr = {};
+          (_e = ssr.external) != null ? _e : ssr.external = [];
+          ssr.external = ssr.external.concat(serverDeps);
+          (await Promise.resolve().then(() => __toModule(require("@marko/compiler/register")))).default(__spreadProps(__spreadValues({}, ssrConfig), {
+            sourceMaps: "inline",
+            modules: "cjs"
+          }));
+        }
+      },
+      configureServer(_server) {
+        ssrConfig.hot = domConfig.hot = true;
+        devServer = _server;
+        devServer.watcher.on("all", (type, filename) => {
+          for (const [id, files] of transformWatchFiles) {
+            if (anyMatch(files, filename)) {
+              devServer.watcher.emit("change", id);
+            }
+          }
+          if (type === "add" || type === "unlink") {
+            let clearedCache = false;
+            for (const [id, files] of transformOptionalFiles) {
+              if (anyMatch(files, filename)) {
+                if (!clearedCache) {
+                  baseConfig.cache.clear();
+                  clearedCache = true;
+                }
+                devServer.watcher.emit("change", id);
+              }
+            }
+          }
+        });
+      },
+      async buildStart(inputOptions) {
+        if (isBuild && linked && !isSSRBuild) {
+          const serverMetaFile = await getServerManifestFile(root);
+          this.addWatchFile(serverMetaFile);
+          try {
+            serverManifest = JSON.parse(await fs.promises.readFile(serverMetaFile, "utf-8"));
+            inputOptions.input = toHTMLEntries(root, serverManifest.entries);
+          } catch (err) {
+            this.error(`You must run the "ssr" build before the "browser" build.`);
+          }
+          if (isEmpty(inputOptions.input)) {
+            this.error("No Marko files were found when compiling the server.");
+          }
+        }
+      },
+      async resolveId(importee, importer, importOpts, ssr = importOpts.ssr) {
+        if (virtualFiles.has(importee)) {
+          return importee;
+        }
+        let importeeQuery = getMarkoQuery(importee);
+        if (importeeQuery) {
+          importee = importee.slice(0, -importeeQuery.length);
+        } else if (ssr && linked && importer && isMarkoFile(importee) && !isMarkoFile(importer.replace(queryReg, ""))) {
+          importeeQuery = serverEntryQuery;
+        } else if (!ssr && isBuild && importer && isMarkoFile(importee) && this.getModuleInfo(importer).isEntry) {
+          importeeQuery = browserEntryQuery;
+        }
+        if (importeeQuery) {
+          const resolved = importee[0] === "." ? {
+            id: importer ? path.resolve(importer, "..", importee) : path.resolve(root, importee)
+          } : await this.resolve(importee, importer, resolveOpts);
+          if (resolved) {
+            resolved.id += importeeQuery;
+          }
+          return resolved;
+        }
+        return null;
+      },
+      async load(id) {
+        const query = getMarkoQuery(id);
+        if (query) {
+          if (!id.startsWith(root)) {
+            id = path.join(root, id);
+          }
+          switch (query) {
+            case serverEntryQuery: {
+              const fileName = id.slice(0, -serverEntryQuery.length);
+              let entryData;
+              if (isBuild) {
+                const relativeFileName = path.relative(root, fileName);
+                const entryId = toEntryId(relativeFileName);
+                serverManifest != null ? serverManifest : serverManifest = {
+                  entries: {},
+                  chunksNeedingAssets: []
+                };
+                serverManifest.entries[entryId] = relativeFileName;
+                entryData = JSON.stringify(entryId);
+              } else {
+                entryData = JSON.stringify(await generateDocManifest(await devServer.transformIndexHtml("/", generateInputDoc(fileNameToURL(fileName, root)))));
+              }
+              return getServerEntryTemplate({
+                fileName,
+                entryData,
+                runtimeId
+              });
+            }
+            case browserEntryQuery:
+              return fs.promises.readFile(id.slice(0, -browserEntryQuery.length), "utf-8");
+          }
+        }
+        return virtualFiles.get(id) || null;
+      },
+      async transformIndexHtml(html) {
+        if (isBuild) {
+          return html;
+        }
+        return html.replace(/src\s*=\s*(['"])(\\.|(?!\1).)*\.marko\1/gim, (m) => m.slice(0, -1) + browserEntryQuery + m.slice(-1));
+      },
+      async transform(source, id, ssr) {
+        const query = getMarkoQuery(id);
+        if (query && !query.startsWith(virtualFileQuery)) {
+          id = id.slice(0, -query.length);
+          if (query === serverEntryQuery) {
+            id = `${id.slice(0, -markoExt.length)}.entry.marko`;
+          }
+        }
+        if (!isMarkoFile(id)) {
+          return null;
+        }
+        const compiled = await compiler.compile(source, id, (typeof ssr === "object" ? ssr.ssr : ssr) ? ssrConfig : query === browserEntryQuery ? hydrateConfig : domConfig);
+        const { map, meta } = compiled;
+        let { code } = compiled;
+        if (query !== browserEntryQuery && devServer) {
+          code += `
+if (import.meta.hot) import.meta.hot.accept();`;
+        }
+        if (devServer) {
+          const templateName = getBasenameWithoutExt(id);
+          const optionalFilePrefix = path.dirname(id) + path.sep + (templateName === "index" ? "" : `${templateName}.`);
+          for (const file of meta.watchFiles) {
+            this.addWatchFile(file);
+          }
+          transformOptionalFiles.set(id, [
+            `${optionalFilePrefix}style.*`,
+            `${optionalFilePrefix}component.*`,
+            `${optionalFilePrefix}component-browser.*`,
+            `${optionalFilePrefix}marko-tag.json`
+          ]);
+          transformWatchFiles.set(id, meta.watchFiles);
+        }
+        return { code, map };
+      }
+    },
+    {
+      name: "marko-vite:post",
+      apply: "build",
+      enforce: "post",
+      async generateBundle(outputOptions, bundle, isWrite) {
+        if (!linked) {
+          return;
+        }
+        if (!isWrite) {
+          this.error(`Linked builds are currently only supported when in "write" mode.`);
+        }
+        if (!serverManifest) {
+          this.error("No Marko files were found when bundling the server in linked mode.");
+        }
+        if (isSSRBuild) {
+          const dir = outputOptions.dir ? path.resolve(outputOptions.dir) : path.resolve(outputOptions.file, "..");
+          for (const fileName in bundle) {
+            const chunk = bundle[fileName];
+            if (chunk.type === "chunk") {
+              for (const id in chunk.modules) {
+                if (id === registeredTag) {
+                  serverManifest.chunksNeedingAssets.push(path.resolve(dir, fileName));
+                  break;
+                }
+              }
+            }
+          }
+          await fs.promises.writeFile(await getServerManifestFile(root), JSON.stringify(serverManifest));
+        } else {
+          const browserManifest = {};
+          for (const entryId in serverManifest.entries) {
+            const fileName = serverManifest.entries[entryId];
+            const chunkId = fileName + htmlExt;
+            const chunk = bundle[chunkId];
+            if ((chunk == null ? void 0 : chunk.type) === "asset") {
+              browserManifest[entryId] = await generateDocManifest(chunk.source.toString());
+              delete bundle[chunkId];
+            } else {
+              this.error(`Marko template had unexpected output from vite, ${fileName}`);
+            }
+          }
+          const manifestStr = `;var __MARKO_MANIFEST__=${JSON.stringify(browserManifest)};
+`;
+          for (const fileName of serverManifest.chunksNeedingAssets) {
+            await fs.promises.appendFile(fileName, manifestStr);
+          }
+        }
+      }
+    }
+  ];
+}
+function getMarkoQuery(id) {
+  var _a;
+  return ((_a = queryReg.exec(id)) == null ? void 0 : _a[0]) || "";
+}
+function isMarkoFile(id) {
+  return id.endsWith(markoExt);
+}
+function toHTMLEntries(root, serverEntries) {
+  const result = [];
+  for (const id in serverEntries) {
+    const markoFile = path.join(root, serverEntries[id]);
+    const htmlFile = markoFile + htmlExt;
+    virtualFiles.set(htmlFile, {
+      code: generateInputDoc(markoFile)
+    });
+    result.push(htmlFile);
+  }
+  return result;
+}
+async function getServerManifestFile(root) {
+  return path.join(await getTempDir(root), "manifest.json");
+}
+function getTempDir(root) {
+  return tempDir || (tempDir = (async () => {
+    const dir = path.join(os.tmpdir(), `marko-vite-${crypto.createHash("SHA1").update(root).digest("hex")}`);
+    try {
+      const stat = await fs.promises.stat(dir);
+      if (stat.isDirectory()) {
+        return dir;
+      }
+    } catch {
+      await fs.promises.mkdir(dir);
+      return dir;
+    }
+    throw new Error("Unable to create temp directory");
+  })());
+}
+function toEntryId(id) {
+  const lastSepIndex = id.lastIndexOf(path.sep);
+  let name = id.slice(lastSepIndex + 1, id.indexOf(".", lastSepIndex));
+  if (name === "index" || name === "template") {
+    name = id.slice(id.lastIndexOf(path.sep, lastSepIndex - 1) + 1, lastSepIndex);
+  }
+  return `${name}_${crypto.createHash("SHA1").update(id).digest("base64").replace(/[/+]/g, "-").slice(0, 4)}`;
+}
+function fileNameToURL(fileName, root) {
+  const relativeURL = path.posix.relative(pathToFileURL(root).pathname, pathToFileURL(fileName).pathname);
+  if (relativeURL[0] === ".") {
+    throw new Error("@marko/vite: Entry templates must exist under the current root directory.");
+  }
+  return `/${relativeURL}`;
+}
+function getBasenameWithoutExt(file) {
+  const baseStart = file.lastIndexOf(path.sep) + 1;
+  const extStart = file.indexOf(".", baseStart + 1);
+  return file.slice(baseStart, extStart);
+}
+function isEmpty(obj) {
+  for (const _ in obj) {
+    return false;
+  }
+  return true;
+}
+export {
+  markoPlugin as default
+};

package/dist/manifest-generator.js

@@ -0,0 +1,88 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  __markAsModule(target);
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && key !== "default")
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toModule = (module2) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+__export(exports, {
+  generateDocManifest: () => generateDocManifest,
+  generateInputDoc: () => generateInputDoc
+});
+var import_htmlparser2 = __toModule(require("htmlparser2"));
+var import_domelementtype = __toModule(require("domelementtype"));
+var import_domhandler = __toModule(require("domhandler"));
+var import_serializer = __toModule(require("./serializer"));
+const MARKER_COMMENT = "MARKO_VITE";
+function generateDocManifest(rawHtml) {
+  return new Promise((resolve, reject) => {
+    const parser = new import_htmlparser2.Parser(new import_domhandler.DomHandler(function(err, dom) {
+      if (err) {
+        return reject(err);
+      }
+      const htmlChildren = dom.find(isElement).childNodes;
+      const headPrepend = [];
+      const head = [];
+      const bodyPrepend = [];
+      const body = [];
+      splitNodesByMarker(htmlChildren.find((node) => isElement(node) && node.tagName === "head").childNodes, headPrepend, head);
+      splitNodesByMarker(htmlChildren.find((node) => isElement(node) && node.tagName === "body").childNodes, bodyPrepend, body);
+      resolve({
+        "head-prepend": serializeOrNull(headPrepend),
+        head: serializeOrNull(head),
+        "body-prepend": serializeOrNull(bodyPrepend),
+        body: serializeOrNull(body)
+      });
+    }));
+    parser.write(rawHtml);
+    parser.end();
+  });
+}
+function generateInputDoc(entry) {
+  return `<!DOCTYPE html><html><head><!--${MARKER_COMMENT}--></head><body><!--${MARKER_COMMENT}--><script async type="module" src=${JSON.stringify(entry)}><\/script></body></html>`;
+}
+function serializeOrNull(nodes) {
+  const result = (0, import_serializer.default)(nodes);
+  if (result.length) {
+    return result;
+  }
+  return null;
+}
+function splitNodesByMarker(nodes, before, after) {
+  for (let i = 0; i < nodes.length; i++) {
+    let node = nodes[i];
+    if (node.data === MARKER_COMMENT) {
+      i++;
+      for (; i < nodes.length; i++) {
+        node = nodes[i];
+        after.push(node);
+      }
+      break;
+    }
+    before.push(node);
+  }
+}
+function isElement(node) {
+  return node.type === import_domelementtype.ElementType.Tag;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  generateDocManifest,
+  generateInputDoc
+});

package/dist/manifest-generator.mjs

@@ -0,0 +1,60 @@
+import { Parser } from "htmlparser2";
+import { ElementType } from "domelementtype";
+import { DomHandler } from "domhandler";
+import serialize from "./serializer";
+const MARKER_COMMENT = "MARKO_VITE";
+function generateDocManifest(rawHtml) {
+  return new Promise((resolve, reject) => {
+    const parser = new Parser(new DomHandler(function(err, dom) {
+      if (err) {
+        return reject(err);
+      }
+      const htmlChildren = dom.find(isElement).childNodes;
+      const headPrepend = [];
+      const head = [];
+      const bodyPrepend = [];
+      const body = [];
+      splitNodesByMarker(htmlChildren.find((node) => isElement(node) && node.tagName === "head").childNodes, headPrepend, head);
+      splitNodesByMarker(htmlChildren.find((node) => isElement(node) && node.tagName === "body").childNodes, bodyPrepend, body);
+      resolve({
+        "head-prepend": serializeOrNull(headPrepend),
+        head: serializeOrNull(head),
+        "body-prepend": serializeOrNull(bodyPrepend),
+        body: serializeOrNull(body)
+      });
+    }));
+    parser.write(rawHtml);
+    parser.end();
+  });
+}
+function generateInputDoc(entry) {
+  return `<!DOCTYPE html><html><head><!--${MARKER_COMMENT}--></head><body><!--${MARKER_COMMENT}--><script async type="module" src=${JSON.stringify(entry)}><\/script></body></html>`;
+}
+function serializeOrNull(nodes) {
+  const result = serialize(nodes);
+  if (result.length) {
+    return result;
+  }
+  return null;
+}
+function splitNodesByMarker(nodes, before, after) {
+  for (let i = 0; i < nodes.length; i++) {
+    let node = nodes[i];
+    if (node.data === MARKER_COMMENT) {
+      i++;
+      for (; i < nodes.length; i++) {
+        node = nodes[i];
+        after.push(node);
+      }
+      break;
+    }
+    before.push(node);
+  }
+}
+function isElement(node) {
+  return node.type === ElementType.Tag;
+}
+export {
+  generateDocManifest,
+  generateInputDoc
+};

package/dist/render-assets-transform.js

@@ -0,0 +1,21 @@
+var __defProp = Object.defineProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  __markAsModule(target);
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+__export(exports, {
+  default: () => render_assets_transform_default
+});
+var render_assets_transform_default = (tag, t) => {
+  const body = tag.get("body");
+  const tagName = tag.get("name").node.value;
+  body.unshiftContainer("body", renderAssetsCall(t, `${tagName}-prepend`));
+  body.pushContainer("body", renderAssetsCall(t, tagName));
+};
+function renderAssetsCall(t, slot) {
+  return t.callExpression(t.memberExpression(t.memberExpression(t.identifier("out"), t.identifier("global")), t.identifier("___viteRenderAssets")), [t.identifier("out"), t.stringLiteral(slot)]);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {});

package/dist/render-assets-transform.mjs

@@ -0,0 +1,12 @@
+var render_assets_transform_default = (tag, t) => {
+  const body = tag.get("body");
+  const tagName = tag.get("name").node.value;
+  body.unshiftContainer("body", renderAssetsCall(t, `${tagName}-prepend`));
+  body.pushContainer("body", renderAssetsCall(t, tagName));
+};
+function renderAssetsCall(t, slot) {
+  return t.callExpression(t.memberExpression(t.memberExpression(t.identifier("out"), t.identifier("global")), t.identifier("___viteRenderAssets")), [t.identifier("out"), t.stringLiteral(slot)]);
+}
+export {
+  render_assets_transform_default as default
+};