@quilted/rollup 0.2.44 → 0.2.46

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @quilted/rollup
 
+## 0.2.46
+
+### Patch Changes
+
+- [`c421ad9`](https://github.com/lemonmade/quilt/commit/c421ad92ce5554d2b6b9c0b44f24378759dce5ab) Thanks [@lemonmade](https://github.com/lemonmade)! - Allow additional entries to be marked as inlined to include their content in the browser asset manifest
+
+- Updated dependencies [[`c421ad9`](https://github.com/lemonmade/quilt/commit/c421ad92ce5554d2b6b9c0b44f24378759dce5ab)]:
+  - @quilted/assets@0.1.8
+
+## 0.2.45
+
+### Patch Changes
+
+- [`3a20ff9`](https://github.com/lemonmade/quilt/commit/3a20ff9101119d07bad8ddfbf414be4d3833c3b1) Thanks [@lemonmade](https://github.com/lemonmade)! - Simplify default async input equality check, and remove `dequal` as a framework dependency
+
+- Updated dependencies []:
+  - @quilted/graphql@3.3.7
+
 ## 0.2.44
 
 ### Patch Changes

package/build/esm/app.mjs

@@ -122,6 +122,7 @@ async function quiltAppBrowserPlugins({
   root = process.cwd(),
   app,
   entry,
+  entries,
   env,
   assets,
   module,
@@ -153,6 +154,7 @@ async function quiltAppBrowserPlugins({
     { workers },
     { esnext },
     nodePlugins,
+    supportsESM,
     supportsModuleWorkers
   ] = await Promise.all([
     import('rollup-plugin-visualizer'),
@@ -171,12 +173,12 @@ async function quiltAppBrowserPlugins({
       bundle: true,
       resolve: { exportConditions: ["browser"] }
     }),
+    targetsSupportModules(browserGroup.browsers),
     targetsSupportModuleWebWorkers(browserGroup.browsers)
   ]);
   const plugins = [
-    quiltAppBrowserInput({ root: project.root, entry }),
+    quiltAppBrowserInput({ root: project.root, entry, entries }),
     ...nodePlugins,
-    systemJS({ minify }),
     replaceProcessEnv({ mode }),
     magicModuleEnv({ ...resolveEnvOption(env), mode, root: project.root }),
     magicModuleAppComponent({ entry: app, root: project.root }),
@@ -228,6 +230,9 @@ async function quiltAppBrowserPlugins({
     tsconfigAliases({ root: project.root }),
     monorepoPackageAliases({ root: project.root })
   ];
+  if (!supportsESM) {
+    plugins.push(systemJS({ minify }));
+  }
   if (assets?.clean ?? true) {
     plugins.push(
       removeBuildFiles(
@@ -257,12 +262,21 @@ async function quiltAppBrowserPlugins({
   if (browserGroup.name) {
     cacheKey.set("browserGroup", browserGroup.name);
   }
+  const inline = /* @__PURE__ */ new Set(["system.js"]);
+  if (entries) {
+    for (const [name, entry2] of Object.entries(entries)) {
+      if (typeof entry2 === "object" && entry2.inline) {
+        inline.add(name.startsWith("./") ? name.slice(2) : name);
+      }
+    }
+  }
   plugins.push(
     assetManifest({
       key: cacheKey,
       base: baseURL,
       file: path.join(manifestsDirectory, `assets${targetFilenamePart}.json`),
-      priority: assets?.priority
+      priority: assets?.priority,
+      inline
     }),
     visualizer({
       template: "treemap",
@@ -278,15 +292,22 @@ async function quiltAppBrowserPlugins({
 }
 function quiltAppBrowserInput({
   root,
-  entry
+  entry,
+  entries
 } = {}) {
   const MODULES_TO_ENTRIES = /* @__PURE__ */ new Map();
   return {
     name: "@quilted/app-browser/input",
     async options(options) {
-      const finalEntry = normalizeRollupInput(options.input) ?? await sourceEntryForAppBrowser({ entry, root }) ?? MAGIC_MODULE_ENTRY;
+      const finalEntry = normalizeRollupInput(options.input) ?? await sourceEntryForAppBrowser({
+        entry: entry ?? getSourceFromCustomEntry(entries?.["."]),
+        root
+      }) ?? MAGIC_MODULE_ENTRY;
       const finalEntryName = typeof finalEntry === "string" && finalEntry !== MAGIC_MODULE_ENTRY ? path.basename(finalEntry).split(".").slice(0, -1).join(".") : "browser";
-      const additionalEntries = await additionalEntriesForAppBrowser({ root });
+      const additionalEntries = await additionalEntriesForAppBrowser({
+        root,
+        entries
+      });
       if (typeof finalEntry === "string") {
         MODULES_TO_ENTRIES.set(finalEntry, ".");
       }
@@ -721,7 +742,7 @@ function magicModuleAppRequestRouter({
 
         import {jsx} from 'preact/jsx-runtime';
         import {RequestRouter} from '@quilted/quilt/request-router';
-        import {renderToResponse} from '@quilted/quilt/server';
+        import {renderAppToHTMLResponse} from '@quilted/quilt/server';
 
         import App from ${JSON.stringify(MAGIC_MODULE_APP_COMPONENT)};
         import {BrowserAssets} from ${JSON.stringify(
@@ -733,7 +754,7 @@ function magicModuleAppRequestRouter({
 
         // For all GET requests, render our React application.
         router.get(async (request) => {
-          const response = await renderToResponse(jsx(App), {
+          const response = await renderAppToHTMLResponse(jsx(App), {
             request,
             assets,
           });
@@ -883,6 +904,7 @@ const SERVER_EXPORT_CONDITIONS = /* @__PURE__ */ new Set([
   "default"
 ]);
 async function additionalEntriesForAppBrowser({
+  entries,
   root = process.cwd()
 }) {
   const additionalEntries = {};
@@ -902,6 +924,17 @@ async function additionalEntriesForAppBrowser({
       }
     }
   }
+  if (entries) {
+    for (const [key, value] of Object.entries(entries)) {
+      if (key === ".") continue;
+      const name = key.startsWith("./") ? key.slice(2) : key;
+      if (typeof value === "string") {
+        additionalEntries[name] = project.resolve(value);
+      } else {
+        additionalEntries[name] = project.resolve(value.source);
+      }
+    }
+  }
   return additionalEntries;
 }
 function resolveExportsField(project, entry, conditions) {
@@ -971,7 +1004,6 @@ const FRAMEWORK_TEST_STRINGS = [
   "/node_modules/preact/",
   "/node_modules/react/",
   "/node_modules/js-cookie/",
-  "/node_modules/dequal/",
   "/node_modules/@quilted/quilt/",
   "/node_modules/@preact/signals/",
   "/node_modules/@preact/signals-core/",
@@ -1035,5 +1067,8 @@ function createManualChunksSorter() {
     return `${bundleBaseName}-${relativeId.split(path.sep)[0]?.split(".")[0]}`;
   };
 }
+function getSourceFromCustomEntry(entry) {
+  return typeof entry === "object" ? entry.source : entry;
+}
 
 export { MAGIC_MODULE_APP_COMPONENT, MAGIC_MODULE_BROWSER_ASSETS, MAGIC_MODULE_ENTRY, MAGIC_MODULE_REQUEST_ROUTER, additionalEntriesForAppBrowser, magicModuleAppAssetManifests, magicModuleAppBrowserEntry, magicModuleAppComponent, magicModuleAppRequestRouter, nodeAppServerRuntime, quiltApp, quiltAppBrowser, quiltAppBrowserInput, quiltAppBrowserPlugins, quiltAppServer, quiltAppServerInput, quiltAppServerPlugins, quiltAppServiceWorker, quiltAppServiceWorkerInput, quiltAppServiceWorkerPlugins, sourceEntryForAppBrowser, sourceEntryForAppServer, sourceEntryForAppServiceWorker };

package/build/esm/features/assets.mjs

@@ -15,6 +15,7 @@ async function writeManifestForBundle(bundle, {
   file,
   base,
   key,
+  inline,
   priority,
   moduleID: getModuleID = defaultModuleID
 }, { format }) {
@@ -35,7 +36,7 @@ async function writeManifestForBundle(bundle, {
   function getAssetId(file2) {
     let id = assetIdMap.get(file2);
     if (id == null) {
-      assets.push(loadAsset(file2, bundle[file2]));
+      assets.push(loadAsset(file2, bundle[file2], inline));
       id = assets.length - 1;
       assetIdMap.set(file2, id);
     }
@@ -51,7 +52,17 @@ async function writeManifestForBundle(bundle, {
     modules: {}
   };
   for (const output of outputs) {
-    if (output.type !== "chunk" || !output.isDynamicEntry && !output.isEntry) {
+    if (output.type === "asset") {
+      if (output.name && output.fileName.endsWith(".js")) {
+        manifest.modules[output.name] = createAssetsEntry([output.fileName], {
+          dependencyMap,
+          getAssetId
+        });
+        manifest.entries[`./${output.name}`] = output.name;
+      }
+      continue;
+    }
+    if (!output.isDynamicEntry && !output.isEntry) {
       continue;
     }
     const rollupModuleID = output.facadeModuleId ?? output.moduleIds.at(-1);
@@ -65,9 +76,17 @@ async function writeManifestForBundle(bundle, {
       const entry = moduleInfo?.meta?.quilt?.entry ?? moduleID;
       manifest.entries[entry] = moduleID;
     }
+    const isCSS = moduleID.endsWith(".css");
+    const moduleFiles = [output.fileName, ...output.imports];
     manifest.modules[moduleID] = createAssetsEntry(
-      [...output.imports, output.fileName],
-      { dependencyMap, getAssetId }
+      // When an entrypoint is a CSS file, Rollup creates an unnecessary JavaScript file
+      // as the entrypoint of the module. We will exclude the JavaScript file, so only
+      // the CSS file is included in the final manifest.
+      isCSS ? moduleFiles.filter((file2) => file2.endsWith(".css")) : moduleFiles,
+      {
+        dependencyMap,
+        getAssetId
+      }
     );
   }
   manifest.assets = await Promise.all(assets);
@@ -75,12 +94,17 @@ async function writeManifestForBundle(bundle, {
   await fs.writeFile(file, JSON.stringify(manifest, null, 2));
 }
 const SRI_ALGORITHM = "sha384";
-async function loadAsset(file, chunk) {
+async function loadAsset(file, chunk, inline) {
   const asset = [file.endsWith(".css") ? 1 : 2, file];
-  try {
-    const hash = createHash(SRI_ALGORITHM).update("code" in chunk ? chunk.code : chunk.source).digest().toString("base64");
-    asset[2] = `${SRI_ALGORITHM}-${hash}`;
-  } catch {
+  const source = "code" in chunk ? chunk.code : chunk.source;
+  if (inline?.has(chunk.name)) {
+    asset[2] = source;
+  } else {
+    try {
+      const hash = createHash(SRI_ALGORITHM).update("code" in chunk ? chunk.code : chunk.source).digest().toString("base64");
+      asset[2] = `${SRI_ALGORITHM}-${hash}`;
+    } catch {
+    }
   }
   return asset;
 }

package/build/esm/features/system-js.mjs

@@ -6,21 +6,22 @@ import { multiline } from '../shared/strings.mjs';
 function systemJS({ minify = false } = {}) {
   return {
     name: "@quilted/system-js",
-    async renderChunk(code, chunk, options) {
-      if (options.format !== "system" || !chunk.isEntry) return null;
+    async buildStart() {
       const require = createRequire(import.meta.url);
       const systemjs = minify ? require.resolve("systemjs/dist/s.min.js") : require.resolve("systemjs/dist/s.js");
-      const fileHandle = this.emitFile({
+      this.emitFile({
         type: "asset",
-        name: "loader.js",
+        name: "system.js",
         source: (await readFile(systemjs, { encoding: "utf8" })).replace(
           // Remove the source map comment, if it is present, because we don’t upload the
           // sourcemap for this file.
-          /\n?[/][/]# sourceMappingURL=s.*\.map\n?$/,
+          /\n?[/][/]# sourceMappingURL=s.*\.map\n?$/m,
           ""
-        )
+        ).trim()
       });
-      chunk.imports.unshift(this.getFileName(fileHandle));
+    },
+    async renderChunk(code, chunk, options) {
+      if (options.format !== "system" || !chunk.isEntry) return null;
       const newCode = new MagicString(code);
       newCode.append(multiline`
         if (document.currentScript) {