@normed/bundle 4.5.7 → 4.6.0

package/CHANGELOG.md

@@ -6,6 +6,10 @@ Given a version number MAJOR.MINOR.PATCH, increment the:
 2. MINOR version when you add functionality in a backwards compatible manner, and
 3. PATCH version when you make backwards compatible bug fixes.
 
+# 4.6.0
+
+* MINOR: Add `pkg:` prefix for referencing npm package files in pug templates. CSS files from packages (e.g., `pkg:normalize.css/normalize.css`) are processed through esbuild's CSS pipeline to properly handle `url()` references. Non-CSS files (JS, fonts, images) are copied with content hashing.
+
 # 4.5.7
 
 * PATCH: Fix assets referenced via `url()` in less files (fonts, images) not being output. Previously, only the CSS file was written but referenced assets were missing from the output directory.

package/bundles/bin/cli.js

@@ -69136,6 +69136,7 @@ var import_pug = __toESM(require_lib14());
 var import_fs4 = __toESM(require("fs"));
 var import_path5 = __toESM(require("path"));
 var import_crypto = __toESM(require("crypto"));
+var import_module = require("module");
 function computeContentHash(content) {
   const hash = import_crypto.default.createHash("sha256").update(content).digest();
   const num = hash.readUInt32BE(0);
@@ -69171,14 +69172,36 @@ function isPugReference(assetPath) {
 function isLessReference(assetPath) {
   return assetPath.endsWith(".less") && isRelativeAssetPath(assetPath);
 }
+var PKG_PREFIX = "pkg:";
+function isPackageReference(assetPath) {
+  return assetPath.startsWith(PKG_PREFIX);
+}
+function getPackageSpecifier(assetPath) {
+  return assetPath.slice(PKG_PREFIX.length);
+}
+function isPackageCssReference(assetPath) {
+  return isPackageReference(assetPath) && assetPath.endsWith(".css");
+}
+function resolvePackagePath(packageSpecifier, fromFile) {
+  try {
+    const require2 = (0, import_module.createRequire)(fromFile);
+    return require2.resolve(packageSpecifier);
+  } catch {
+    return null;
+  }
+}
 var discoveredPugReferences = /* @__PURE__ */ new Map();
 var discoveredLessReferences = /* @__PURE__ */ new Map();
+var discoveredPackageCssReferences = /* @__PURE__ */ new Map();
 function clearDiscoveredPugReferences() {
   discoveredPugReferences.clear();
 }
 function clearDiscoveredLessReferences() {
   discoveredLessReferences.clear();
 }
+function clearDiscoveredPackageCssReferences() {
+  discoveredPackageCssReferences.clear();
+}
 function applyAssetNamesTemplate(template, originalPath, hash, baseDir) {
   const ext = import_path5.default.extname(originalPath).slice(1);
   const name3 = import_path5.default.basename(originalPath, import_path5.default.extname(originalPath));
@@ -69190,6 +69213,7 @@ async function processHtmlAssets(html, pugFilePath, options2) {
   const assets = [];
   const pugReferences = [];
   const lessReferences = [];
+  const packageCssReferences = [];
   const assetNames = options2.assetNames || "[name]-[hash]";
   const outdir = options2.outdir || ".";
   const outbase = options2.outbase || import_path5.default.dirname(pugFilePath);
@@ -69216,6 +69240,7 @@ async function processHtmlAssets(html, pugFilePath, options2) {
   }
   const discoveredPugPaths = /* @__PURE__ */ new Set();
   const discoveredLessPaths = /* @__PURE__ */ new Set();
+  const discoveredPackageCssPaths = /* @__PURE__ */ new Set();
   for (const { fullMatch, attr, value } of matches) {
     let newValue = value;
     if (attr === "srcset") {
@@ -69267,6 +69292,32 @@ async function processHtmlAssets(html, pugFilePath, options2) {
         discoveredLessPaths.add(absolutePath);
         lessReferences.push({ originalHref: value, absolutePath });
       }
+    } else if (isPackageCssReference(value)) {
+      const packageSpecifier = getPackageSpecifier(value);
+      const absolutePath = resolvePackagePath(packageSpecifier, pugFilePath);
+      if (absolutePath && !discoveredPackageCssPaths.has(absolutePath)) {
+        discoveredPackageCssPaths.add(absolutePath);
+        packageCssReferences.push({ originalHref: value, absolutePath });
+      }
+    } else if (isPackageReference(value)) {
+      const packageSpecifier = getPackageSpecifier(value);
+      const absolutePath = resolvePackagePath(packageSpecifier, pugFilePath);
+      if (absolutePath) {
+        const hashedPath = await processPackageAsset(
+          absolutePath,
+          packageSpecifier,
+          pugFilePath,
+          outdir,
+          outbase,
+          assetNames,
+          publicPath,
+          assets,
+          processedAssets
+        );
+        if (hashedPath) {
+          newValue = hashedPath;
+        }
+      }
     } else if (isRelativeAssetPath(value)) {
       const hashedPath = await processAsset(
         value,
@@ -69288,7 +69339,13 @@ async function processHtmlAssets(html, pugFilePath, options2) {
       modifiedHtml = modifiedHtml.replace(fullMatch, newFullMatch);
     }
   }
-  return { html: modifiedHtml, assets, pugReferences, lessReferences };
+  return {
+    html: modifiedHtml,
+    assets,
+    pugReferences,
+    lessReferences,
+    packageCssReferences
+  };
 }
 async function processAsset(assetPath, pugDir, pugFilePath, outdir, outbase, assetNames, publicPath, assets, processedAssets) {
   const absoluteSource = import_path5.default.resolve(pugDir, assetPath);
@@ -69329,6 +69386,46 @@ async function processAsset(assetPath, pugDir, pugFilePath, outdir, outbase, ass
     return null;
   }
 }
+async function processPackageAsset(absoluteSource, packageSpecifier, pugFilePath, outdir, outbase, assetNames, publicPath, assets, processedAssets) {
+  if (processedAssets.has(absoluteSource)) {
+    return processedAssets.get(absoluteSource);
+  }
+  if (!import_fs4.default.existsSync(absoluteSource)) {
+    return null;
+  }
+  try {
+    const content = await import_fs4.default.promises.readFile(absoluteSource);
+    const hash = computeContentHash(content);
+    const filename = import_path5.default.basename(packageSpecifier);
+    const hashedFilename = applyAssetNamesTemplate(
+      assetNames,
+      filename,
+      hash,
+      ""
+      // No base dir for package assets
+    );
+    const absoluteOutput = import_path5.default.join(outdir, hashedFilename);
+    const pugRelativeToOutbase = import_path5.default.relative(outbase, pugFilePath);
+    const htmlOutputPath = import_path5.default.join(outdir, pugRelativeToOutbase);
+    const htmlOutputDir = import_path5.default.dirname(htmlOutputPath);
+    let htmlPath;
+    if (publicPath) {
+      htmlPath = publicPath.replace(/\/$/, "") + "/" + hashedFilename;
+    } else {
+      htmlPath = import_path5.default.relative(htmlOutputDir, absoluteOutput);
+    }
+    assets.push({
+      originalPath: packageSpecifier,
+      hashedPath: htmlPath,
+      absoluteSource,
+      absoluteOutput
+    });
+    processedAssets.set(absoluteSource, htmlPath);
+    return htmlPath;
+  } catch {
+    return null;
+  }
+}
 async function copyAssets(assets) {
   const written = /* @__PURE__ */ new Set();
   for (const asset of assets) {
@@ -69423,7 +69520,8 @@ async function loadAsEntrypoint(filepath, options2) {
     html: processedHtml,
     assets,
     pugReferences,
-    lessReferences
+    lessReferences,
+    packageCssReferences
   } = await processHtmlAssets(contents, filepath, options2);
   contents = processedHtml;
   if (pugReferences.length > 0) {
@@ -69432,6 +69530,9 @@ async function loadAsEntrypoint(filepath, options2) {
   if (lessReferences.length > 0) {
     discoveredLessReferences.set(filepath, lessReferences);
   }
+  if (packageCssReferences.length > 0) {
+    discoveredPackageCssReferences.set(filepath, packageCssReferences);
+  }
   if (assets.length > 0) {
     await copyAssets(assets);
   }
@@ -69693,6 +69794,18 @@ function rewriteLessReferencesInHtml(html, lessReferences, lessToOutputPath, htm
   }
   return result;
 }
+function rewritePackageCssReferencesInHtml(html, packageCssReferences, packageCssToOutputPath, htmlOutputDir, outdir) {
+  let result = html;
+  for (const ref of packageCssReferences) {
+    const outputPath = packageCssToOutputPath.get(ref.absolutePath);
+    if (outputPath) {
+      const absoluteOutputPath = import_path8.default.join(outdir, outputPath);
+      const relativePath = import_path8.default.relative(htmlOutputDir, absoluteOutputPath);
+      result = result.split(ref.originalHref).join(relativePath);
+    }
+  }
+  return result;
+}
 function outExt(inExt) {
   if (inExt.match(/^((c|m)?sx?|tsx?)$/)) {
     return "js";
@@ -69799,13 +69912,17 @@ var esbuilder = {
       );
       clearDiscoveredPugReferences();
       clearDiscoveredLessReferences();
+      clearDiscoveredPackageCssReferences();
       const pugHtmlOutputs = /* @__PURE__ */ new Map();
       const pugToOutputPath = /* @__PURE__ */ new Map();
       const lessToOutputPath = /* @__PURE__ */ new Map();
+      const packageCssToOutputPath = /* @__PURE__ */ new Map();
       const processedPugFiles = /* @__PURE__ */ new Set();
       const processedLessFiles = /* @__PURE__ */ new Set();
+      const processedPackageCssFiles = /* @__PURE__ */ new Set();
       const pendingPugFiles = [];
       const pendingLessFiles = [];
+      const pendingPackageCssFiles = [];
       const processOutputFiles = async (result, currentOutputFilesMap, isDiscoveredBuild) => {
         if (result.errors.length || result.warnings.length) {
           log_default.info(`Build completed with errors or warnings:`, {
@@ -69866,6 +69983,7 @@ var esbuilder = {
           if (isHtmlOutput && sourcePath) {
             const pugRefs = discoveredPugReferences.get(sourcePath) || [];
             const lessRefs = discoveredLessReferences.get(sourcePath) || [];
+            const packageCssRefs = discoveredPackageCssReferences.get(sourcePath) || [];
             pugToOutputPath.set(sourcePath, relativeTarget);
             for (const ref of pugRefs) {
               if (!processedPugFiles.has(ref.absolutePath) && !pendingPugFiles.includes(ref.absolutePath)) {
@@ -69895,12 +70013,27 @@ var esbuilder = {
                 }
               }
             }
+            for (const ref of packageCssRefs) {
+              if (!processedPackageCssFiles.has(ref.absolutePath) && !pendingPackageCssFiles.includes(ref.absolutePath)) {
+                if (import_fs7.default.existsSync(ref.absolutePath)) {
+                  pendingPackageCssFiles.push(ref.absolutePath);
+                  log_default.debug(
+                    `Discovered package CSS reference: ${ref.originalHref} -> ${ref.absolutePath}`
+                  );
+                } else {
+                  log_default.warn(
+                    `Referenced package CSS file not found: ${ref.originalHref} (resolved to ${ref.absolutePath})`
+                  );
+                }
+              }
+            }
             pugHtmlOutputs.set(sourcePath, {
               content: file.text,
               sourcePath,
               outputPath: import_path8.default.join(outdir, relativeTarget),
               pugReferences: pugRefs,
-              lessReferences: lessRefs
+              lessReferences: lessRefs,
+              packageCssReferences: packageCssRefs
             });
           } else {
             if (relativeTarget.endsWith(".css") && oFM_result?.entrypoint?.infile.extension === "less") {
@@ -70023,6 +70156,39 @@ var esbuilder = {
               }
             }
           }
+          while (pendingPackageCssFiles.length > 0) {
+            const batch = pendingPackageCssFiles.splice(0);
+            const newEntryPoints = batch.filter(
+              (f) => !processedPackageCssFiles.has(f)
+            );
+            if (newEntryPoints.length === 0) break;
+            log_default.debug(
+              `Building ${newEntryPoints.length} discovered package CSS file(s):`,
+              newEntryPoints
+            );
+            for (const cssSourcePath of newEntryPoints) {
+              processedPackageCssFiles.add(cssSourcePath);
+              const entryNames = "[name]-[hash]";
+              const cssConfig = {
+                ...finalConfig,
+                entryPoints: [cssSourcePath],
+                entryNames
+              };
+              const cssResult = await esbuild.build(cssConfig);
+              for (const file of cssResult.outputFiles) {
+                const relativeFilePath = import_path8.default.relative(outdir, file.path);
+                if (relativeFilePath.endsWith(".css")) {
+                  packageCssToOutputPath.set(cssSourcePath, relativeFilePath);
+                  log_default.debug(
+                    `Built package CSS file: ${cssSourcePath} -> ${relativeFilePath}`
+                  );
+                }
+                await fileWriter.writeFile(file.path, file.contents, {
+                  encoding: "utf-8"
+                });
+              }
+            }
+          }
           log_default.debug(
             `Rewriting pug/less references in ${pugHtmlOutputs.size} HTML file(s)`
           );
@@ -70048,6 +70214,15 @@ var esbuilder = {
                 outdir
               );
             }
+            if (output.packageCssReferences.length > 0) {
+              html = rewritePackageCssReferencesInHtml(
+                html,
+                output.packageCssReferences,
+                packageCssToOutputPath,
+                htmlOutputDir,
+                outdir
+              );
+            }
             const promise = fileWriter.writeFile(output.outputPath, html, {
               encoding: "utf-8"
             });