vite-plugin-preload/dist/index.js

[](https://badge.fury.io/js/vite-plugin-preload)

"use strict";
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 __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/index.ts
var src_exports = {};
__export(src_exports, {
  default: () => VitePluginPreloadAll
});
module.exports = __toCommonJS(src_exports);

// src/options.ts
var defaultOptions = {
  includeJs: true,
  includeCss: true,
  format: true,
  mode: "preload",
  shouldPreload: () => true
};

// src/index.ts
var import_pluginutils = require("@rollup/pluginutils");

// src/dom-utils.ts
var import_jsdom = require("jsdom");
var import_path = require("path");
var createDom = (source) => new import_jsdom.JSDOM(source);
var createModulePreloadLinkElement = (dom, path) => {
  const link = dom.window.document.createElement("link");
  link.rel = "modulepreload";
  link.href = path;
  return link;
};
var createPrefetchLinkElement = (dom, path) => {
  const link = dom.window.document.createElement("link");
  link.rel = "prefetch";
  link.href = path;
  return link;
};
var createStylesheetLinkElement = (dom, path) => {
  const link = dom.window.document.createElement("link");
  link.rel = "stylesheet";
  link.href = path;
  return link;
};
var getExistingLinks = (dom) => {
  const existingLinks = [];
  dom.window.document.querySelectorAll("script").forEach((s) => {
    if (!s.src) {
      return;
    }
    existingLinks.push(s.src);
  });
  dom.window.document.querySelectorAll("link").forEach((l) => existingLinks.push((0, import_path.normalize)(l.href)));
  return existingLinks;
};
var appendToDom = (dom, link) => dom.window.document.head.appendChild(link);

// src/index.ts
var import_prettier = __toESM(require("prettier"));
var import_url = require("url");
var import_path2 = require("path");
var jsFilter = (0, import_pluginutils.createFilter)(["**/*-*.js"]);
var cssFilter = (0, import_pluginutils.createFilter)(["**/*-*.css"]);
function VitePluginPreloadAll(options) {
  let viteConfig;
  const mergedOptions = { ...defaultOptions, ...options };
  return {
    name: "vite:vite-plugin-preload",
    enforce: "post",
    apply: "build",
    configResolved(config) {
      viteConfig = config;
    },
    transformIndexHtml: {
      order: "post",
      handler: (html, ctx) => {
        if (!ctx.bundle) {
          return html;
        }
        const base = viteConfig.base ?? "";
        const dom = createDom(html);
        const existingLinks = getExistingLinks(dom);
        let additionalModules = [];
        let additionalStylesheets = [];
        for (const bundle of Object.values(ctx.bundle)) {
          const path = (0, import_path2.normalize)((0, import_url.resolve)(base, bundle.fileName));
          if (existingLinks.includes(path) || !mergedOptions.shouldPreload(bundle)) {
            continue;
          }
          if (mergedOptions.includeJs && bundle.type === "chunk" && jsFilter(bundle.fileName)) {
            additionalModules.push(path);
          }
          if (mergedOptions.includeCss && bundle.type === "asset" && cssFilter(bundle.fileName)) {
            additionalStylesheets.push(path);
          }
        }
        additionalModules = additionalModules.sort(
          (a, z) => a.localeCompare(z)
        );
        additionalStylesheets = additionalStylesheets.sort(
          (a, z) => a.localeCompare(z)
        );
        if (mergedOptions.mode === "preload") {
          for (const additionalModule of additionalModules) {
            const element = createModulePreloadLinkElement(
              dom,
              additionalModule
            );
            appendToDom(dom, element);
          }
          for (const additionalStylesheet of additionalStylesheets) {
            const element = createStylesheetLinkElement(
              dom,
              additionalStylesheet
            );
            appendToDom(dom, element);
          }
        } else if (mergedOptions.mode === "prefetch") {
          for (const additionalModule of additionalModules) {
            const element = createPrefetchLinkElement(dom, additionalModule);
            appendToDom(dom, element);
          }
          for (const additionalStylesheet of additionalStylesheets) {
            const element = createPrefetchLinkElement(
              dom,
              additionalStylesheet
            );
            appendToDom(dom, element);
          }
        } else {
          throw new Error(`Unsupported "mode" option: ${mergedOptions.mode}`);
        }
        const unformattedHtml = dom.serialize();
        if (mergedOptions.format === false) {
          return unformattedHtml;
        }
        return import_prettier.default.format(unformattedHtml, {
          ...typeof mergedOptions.format === "object" ? mergedOptions.format : {},
          parser: "html"
        });
      }
    }
  };
}