@inizioevoke/astro-core 1.0.0

package/src/integrations/relative-links.ts

@@ -0,0 +1,178 @@
+import type { AstroIntegration, AstroConfig } from 'astro';
+import { readdir, readFile, writeFile } from 'node:fs/promises';
+import path from 'path';
+import { fileURLToPath } from 'url';
+
+// adapted from https://github.com/ixkaito/astro-relative-links/blob/main/src/index.ts
+
+/**
+ * Add leading and trailing slashes to the `base`.
+ *
+ * @param {string} base
+ * @returns {string} - Formatted base.
+ */
+export function leadingTrailingSlash(base?: string) {
+  return base?.replace(/^\/*([^\/]+)(.*)([^\/]+)\/*$/, '/$1$2$3/') || '/';
+}
+
+const pattern = {
+  htmlAttr: `(href|src(set)?|poster|component-url|renderer-url)=["']?([^"']*,)?`,
+  styleAttr: `style=("[^"]*|'[^']*|[^\\s]*)`,
+  styleUrl: `url\\(\\s*?["']?`,
+};
+
+/**
+ * Replace absolute paths in HTML files with relative paths.
+ *
+ * @param {object} options
+ * @param {string} options.outDirPath - The path of the directory that `astro build` writes final build to.
+ * @param {string} options.filePath - The path of the target file.
+ * @param {string} options.base - The base path to deploy to.
+ * @param {string} options.html - The content of the HTML file.
+ * @returns {string} - Replaced HTML
+ */
+function replaceHTML({
+  outDirPath,
+  filePath,
+  base,
+  html,
+}: {
+  outDirPath: string;
+  filePath: string;
+  base: string;
+  html: string;
+}) {
+  const { htmlAttr, styleAttr, styleUrl } = pattern;
+  const htmlPattern =
+    `<[^>]+\\s(` + htmlAttr + `|` + styleAttr + styleUrl + `)`;
+  const cssPattern = `<style>[^<]*` + styleUrl;
+  const regex = new RegExp(
+    `(?<=(` + htmlPattern + `|` + cssPattern + `)\\s*?)${base}(?!\/)`,
+    'gm'
+  );
+
+  const relativePath =
+    path
+      .relative(path.dirname(filePath), outDirPath)
+      .split(path.sep)
+      .join(path.posix.sep) || '.';
+
+  return html.replace(regex, `${relativePath}/`);
+}
+
+/**
+ * Replace absolute paths in CSS files with relative paths.
+ *
+ * @param {object} options
+ * @param {string} options.outDirPath - The path of the directory that `astro build` writes final build to.
+ * @param {string} options.filePath - The path of the target file.
+ * @param {string} options.base - The base path to deploy to.
+ * @param {string} options.css - The content of the CSS file.
+ * @returns {string} - Replaced CSS
+ */
+function replaceCSS({
+  outDirPath,
+  filePath,
+  base,
+  css,
+}: {
+  outDirPath: string;
+  filePath: string;
+  base: string;
+  css: string;
+}) {
+  const { styleUrl } = pattern;
+  const regex = new RegExp(`(?<=` + styleUrl + `\\s*?)${base}(?!\/)`, 'gm');
+
+  const relativePath =
+    path
+      .relative(path.dirname(filePath), outDirPath)
+      .split(path.sep)
+      .join(path.posix.sep) || '.';
+
+  return css.replace(regex, `${relativePath}/`);
+}
+
+const getFilePaths = (() => {
+  async function get(dir: string, exts: string[], out: Record<string, string[]> = {}) {
+    const entries = await readdir(dir, { withFileTypes: true });
+    for (const entry of entries) {
+      const entryPath = path.join(dir, entry.name);
+      if (entry.isFile()) {
+        const fileExt = entryPath.slice(entryPath.lastIndexOf('.')).toLowerCase();
+        if (out[fileExt] === undefined) {
+          out[fileExt] = [];
+        }
+        if (exts.length > 0) {
+          for (const e of exts) {
+            if (e?.trim()?.toLowerCase() === fileExt) {
+              out[fileExt].push(entryPath);
+              break;
+            }
+          }
+        } else {
+          out[fileExt].push(entryPath);
+        }
+      } else if (entry.isDirectory()) {
+        await get(entryPath, exts, out);
+      }
+    }
+  }
+
+  return async (dir: string, ext: string | string[]): Promise<Record<string,string[]>> => {
+    const out: Record<string,string[]> = {};
+    await get(dir, (ext instanceof Array ? ext : [ext]), out);
+    return out;
+  };
+})();
+
+interface IntegrationProps {
+  enabled?: boolean;
+}
+export default function ({ enabled = true }: IntegrationProps): AstroIntegration {
+  let astroConfig: AstroConfig;
+
+  return {
+    name: 'relative-links',
+    hooks: {
+      'astro:config:setup': ({ config }) => {
+        astroConfig = config;
+      },
+      'astro:build:done': async ({ dir, logger }) => {
+        if (enabled) {
+          const base = leadingTrailingSlash(astroConfig.base);
+          logger.info('Making links relative');
+          // Use fileURLToPath to get a valid, cross-platform absolute path string
+          const outDirPath = fileURLToPath(dir);
+          const files = await getFilePaths(outDirPath, ['.css','.html']);
+          try {
+            // HTML
+            for (const filePath of files['.html']) {
+              const html = replaceHTML({
+                outDirPath,
+                filePath,
+                base,
+                html: await readFile(filePath, 'utf8'),
+              });
+              await writeFile(filePath, html, 'utf8');
+            }
+            
+
+            // CSS
+            for (const filePath of files['.css']) {
+              const css = replaceCSS({
+                outDirPath,
+                filePath,
+                base,
+                css: await readFile(filePath, 'utf8'),
+              });
+              await writeFile(filePath, css, 'utf8');
+            }
+          } catch (error: any) {
+            logger.error(error.toString());
+          }
+        }
+      }
+    }
+  };
+}