fix: improve tags api support (#170)

marko-js · Nov 22, 2024 · 89bdc76 · 89bdc76
1 parent 160e850
commit 89bdc76
Show file tree

Hide file tree

Showing 3 changed files with 47 additions and 34 deletions.
diff --git a/.changeset/fair-cherries-remember.md b/.changeset/fair-cherries-remember.md
@@ -0,0 +1,5 @@
+---
+"@marko/vite": patch
+---
+
+Improve support for tags api.
diff --git a/src/render-assets-runtime.ts b/src/render-assets-runtime.ts
@@ -11,6 +11,19 @@ if (typeof base !== "string") throw new Error("${opts.basePathVar} must be defin
 if (!base.endsWith("/")) throw new Error("${opts.basePathVar} must end with a '/' when using basePathVar.");`
       : "const base = import.meta.env.BASE_URL;"
   }
+
+export function getPrepend(g) {
+  return (
+    g.___viteRenderAssets("head-prepend") +
+    g.___viteRenderAssets("head") +
+    g.___viteRenderAssets("body-prepend") 
+  );
+}
+export function getAppend(g) {
+  return (
+    g.___viteRenderAssets("body-prepend") 
+  );
+}
 export function addAssets(g, newEntries) {
   const entries = g.___viteEntries;
   if (entries) {

diff --git a/src/server-entry-template.ts b/src/server-entry-template.ts
@@ -7,46 +7,41 @@ export default async (opts: {
   basePathVar?: string;
   tagsAPI?: boolean;
 }): Promise<string> => {
-  const addAssetsCall = `addAssets($global, [${opts.entryData.join(",")}])`;
   const fileNameStr = JSON.stringify(`./${path.basename(opts.fileName)}`);
-  return `import template from ${fileNameStr};
-export * from ${fileNameStr};
-import { addAssets } from "${renderAssetsRuntimeId}";
-
-${opts.tagsAPI ? `<const/writeSync=${addAssetsCall}/>` : `$ const writeSync = ${addAssetsCall};`}
-
-${opts.tagsAPI ? "<if=writeSync>" : "<if(writeSync)>"}
-  $!{
-    $global.___viteRenderAssets("head-prepend") +
-    $global.___viteRenderAssets("head") +
-    $global.___viteRenderAssets("body-prepend")
-  }
-</>
-<else>
-  <__flush_here_and_after__>
-    $!{
-      $global.___viteRenderAssets("head-prepend") +
-      $global.___viteRenderAssets("head") +
-      $global.___viteRenderAssets("body-prepend")
-    }
-  </__flush_here_and_after__>
-</>
 
-<\${template} ...input/>${
-    opts.tagsAPI
-      ? ""
-      : `
-<init-components/>
-<await-reorderer/>`
+  if (opts.tagsAPI) {
+    return `import Template from ${fileNameStr};
+export * from ${fileNameStr};
+import { addAssets, getPrepend, getAppend } from "${renderAssetsRuntimeId}";
+static function flush($global, html) {
+  return getPrepend($global) + html + getAppend($global);
+}
+static function setFlush($global) {
+  $global.__flush__ = flush;
+}
+static const assets = [${opts.entryData.join(",")}];
+<const/writeSync=addAssets($global, assets) || setFlush($global)/>
+-- $!{writeSync && getPrepend($global)}
+<Template ...input/>
+-- $!{writeSync && getAppend($global)}
+`;
   }
 
-${opts.tagsAPI ? "<if=writeSync>" : "<if(writeSync)>"}
-  $!{$global.___viteRenderAssets("body")}
+  return `import template from ${fileNameStr};
+export * from ${fileNameStr};
+import { addAssets, getPrepend, getAppend } from "${renderAssetsRuntimeId}";
+static const assets = [${opts.entryData.join(",")}];
+<if(addAssets($global, assets))>
+  $!{getPrepend($global)}
+  <\${template} ...input/>
+  $!{getAppend($global)}
 </>
 <else>
-  <__flush_here_and_after__>
-    $!{$global.___viteRenderAssets("body")}
-  </__flush_here_and_after__>
+  <__flush_here_and_after__>$!{getPrepend($global)}</>
+  <\${template} ...input/>
+  <init-components/>
+  <await-reorderer/>
+  <__flush_here_and_after__>$!{getAppend($global)}</>
 </>
 `;
 };