Build: Combine replace-module and replace-text plugin (#12489)

scripts/build/bundler.mjs

@@ -8,7 +8,6 @@ import browserslistToEsbuild from "browserslist-to-esbuild";
 import { PROJECT_ROOT, DIST_DIR } from "../utils/index.mjs";
 import esbuildPluginEvaluate from "./esbuild-plugins/evaluate.mjs";
 import esbuildPluginReplaceModule from "./esbuild-plugins/replace-module.mjs";
-import esbuildPluginReplaceText from "./esbuild-plugins/replace-text.mjs";
 import esbuildPluginLicense from "./esbuild-plugins/license.mjs";
 import esbuildPluginUmd from "./esbuild-plugins/umd.mjs";
 import esbuildPluginVisualizer from "./esbuild-plugins/visualizer.mjs";
@@ -19,7 +18,6 @@ const { __dirname, readJsonSync, require } = createEsmUtils(import.meta);
 const packageJson = readJsonSync("../../package.json");
 
 const umdTarget = browserslistToEsbuild(packageJson.browserslist);
-const EMPTY_MODULE_REPLACEMENT = { contents: "" };
 
 function getBabelConfig(bundle) {
   const config = {
@@ -77,10 +75,10 @@ const bundledFiles = [
 }));
 
 function* getEsbuildOptions(bundle, buildOptions) {
-  const replaceText = [
+  const replaceModule = [
     // `tslib` exports global variables
     {
-      file: require.resolve("tslib"),
+      module: require.resolve("tslib"),
       find: "factory(createExporter(root",
       replacement: "factory(createExporter({}",
     },
@@ -94,8 +92,8 @@ function* getEsbuildOptions(bundle, buildOptions) {
   if (bundle.target === "universal") {
     // We can't reference `process` in UMD bundles and this is
     // an undocumented "feature"
-    replaceText.push({
-      file: "*",
+    replaceModule.push({
+      module: "*",
       find: "process.env.PRETTIER_DEBUG",
       replacement: "globalThis.PRETTIER_DEBUG",
     });
@@ -111,20 +109,20 @@ function* getEsbuildOptions(bundle, buildOptions) {
     define.__dirname = JSON.stringify("/prettier-security-dirname-placeholder");
   }
 
-  const replaceModule = {};
   // Replace other bundled files
   if (bundle.target === "node") {
     // Replace bundled files and `package.json` with dynamic `require()`
     for (const { input, output } of bundledFiles) {
-      replaceModule[input] = { path: output, external: true };
+      replaceModule.push({ module: input, external: output });
     }
   } else {
     // Universal bundle only use version info from package.json
     // Replace package.json with `{version: "{VERSION}"}`
-    replaceModule[path.join(PROJECT_ROOT, "package.json")] = {
-      contents: JSON.stringify({ version: packageJson.version }),
+    replaceModule.push({
+      module: path.join(PROJECT_ROOT, "package.json"),
+      text: JSON.stringify({ version: packageJson.version }),
       loader: "json",
-    };
+    });
 
     // Replace parser getters with `undefined`
     for (const file of [
@@ -136,11 +134,14 @@ function* getEsbuildOptions(bundle, buildOptions) {
       "src/language-markdown/parsers.js",
       "src/language-yaml/parsers.js",
     ]) {
-      replaceModule[path.join(PROJECT_ROOT, file)] = EMPTY_MODULE_REPLACEMENT;
+      replaceModule.push({ module: path.join(PROJECT_ROOT, file), text: "" });
     }
 
     // Prevent `esbuildPluginNodeModulePolyfills` include shim for this module
-    replaceModule.assert = require.resolve("./shims/assert.cjs");
+    replaceModule.push({
+      module: "assert",
+      path: require.resolve("./shims/assert.cjs"),
+    });
   }
 
   let shouldMinify = buildOptions.minify;
@@ -155,12 +156,10 @@ function* getEsbuildOptions(bundle, buildOptions) {
     metafile: true,
     plugins: [
       esbuildPluginEvaluate(),
-      esbuildPluginReplaceModule({ ...replaceModule, ...bundle.replaceModule }),
-      bundle.target === "universal" && esbuildPluginNodeModulePolyfills(),
-      esbuildPluginReplaceText({
-        filter: /\.[cm]?js$/,
-        replacements: [...replaceText, ...(bundle.replaceText ?? [])],
+      esbuildPluginReplaceModule({
+        replacements: [...replaceModule, ...(bundle.replaceModule ?? [])],
       }),
+      bundle.target === "universal" && esbuildPluginNodeModulePolyfills(),
       buildOptions.onLicenseFound &&
         esbuildPluginLicense({
           cwd: PROJECT_ROOT,

scripts/build/config.mjs

@@ -12,8 +12,7 @@ const { require } = createEsmUtils(import.meta);
  * @property {'node' | 'universal'} target - should generate a CJS only for node or universal bundle
  * @property {'core' | 'plugin'} type - it's a plugin bundle or core part of prettier
  * @property {string[]} external - array of paths that should not be included in the final bundle
- * @property {Object.<string, string | {code: string}>} replaceModule - module replacement path or code
- * @property {{file: string, find: string, replacement: string}[]} replaceText - Text replacements
+ * @property {object[]} replaceModule - Module replacements
  * @property {string[]} babelPlugins - babel plugins
  * @property {boolean?} minify - minify
  * @property {string[]?} esbuildTarget - ESBuild target
@@ -31,10 +30,8 @@ To reduce the bundle size, replace the entry with smaller files.
 We can switch to deep require once https://github.com/kpdecker/jsdiff/pull/351 get merged
 */
 const replaceDiffPackageEntry = (file) => ({
-  [require.resolve("diff")]: path.join(
-    path.dirname(require.resolve("diff/package.json")),
-    file
-  ),
+  module: require.resolve("diff"),
+  path: path.join(path.dirname(require.resolve("diff/package.json")), file),
 });
 
 /** @type {Bundle[]} */
@@ -44,10 +41,10 @@ const parsers = [
   },
   {
     input: "src/language-js/parse/flow.js",
-    replaceText: [
+    replaceModule: [
       // `flow-parser` use this for `globalThis`, can't work in strictMode
       {
-        file: require.resolve("flow-parser"),
+        module: require.resolve("flow-parser"),
         find: "(function(){return this}())",
         replacement: "(globalThis)",
       },
@@ -55,40 +52,40 @@ const parsers = [
   },
   {
     input: "src/language-js/parse/typescript.js",
-    replaceText: [
+    replaceModule: [
       // `@typescript-eslint/typescript-estree` v4
       {
-        file: "*",
+        module: "*",
         find: 'require("globby")',
         replacement: "{}",
       },
       {
-        file: "*",
+        module: "*",
         find: "extra.projects = prepareAndTransformProjects(",
         replacement: "extra.projects = [] || prepareAndTransformProjects(",
       },
       {
-        file: "*",
+        module: "*",
         find: "process.versions.node",
         replacement: JSON.stringify("999.999.999"),
       },
       {
-        file: "*",
+        module: "*",
         find: "process.cwd()",
         replacement: JSON.stringify("/prettier-security-dirname-placeholder"),
       },
       {
-        file: "*",
+        module: "*",
         find: 'require("perf_hooks")',
         replacement: "{}",
       },
       {
-        file: "*",
+        module: "*",
         find: 'require("inspector")',
         replacement: "{}",
       },
       {
-        file: "*",
+        module: "*",
         find: "typescriptVersionIsAtLeast[version] = semverCheck(version);",
         replacement: "typescriptVersionIsAtLeast[version] = true;",
       },
@@ -137,29 +134,29 @@ const parsers = [
         'require("source-map-support").install()': "",
         "require(modulePath)": "undefined",
       }).map(([find, replacement]) => ({
-        file: require.resolve("typescript"),
+        module: require.resolve("typescript"),
         find,
         replacement,
       })),
+      {
+        module: require.resolve("debug/src/browser.js"),
+        path: require.resolve("./shims/debug.cjs"),
+      },
     ],
-    replaceModule: {
-      [require.resolve("debug/src/browser.js")]:
-        require.resolve("./shims/debug.cjs"),
-    },
   },
   {
     input: "src/language-js/parse/acorn-and-espree.js",
     name: "prettierPlugins.espree",
     // TODO: Rename this file to `parser-acorn-and-espree.js` or find a better way
     output: "parser-espree.js",
-    replaceText: [
+    replaceModule: [
       {
-        file: require.resolve("espree"),
+        module: require.resolve("espree"),
         find: "const Syntax = (function() {",
         replacement: "const Syntax = undefined && (function() {",
       },
       {
-        file: require.resolve("espree"),
+        module: require.resolve("espree"),
         find: "var visitorKeys = require('eslint-visitor-keys');",
         replacement: "var visitorKeys;",
       },
@@ -170,9 +167,9 @@ const parsers = [
   },
   {
     input: "src/language-js/parse/angular.js",
-    replaceText: [
+    replaceModule: [
       {
-        file: "*",
+        module: "*",
         find: 'require("@angular/compiler/src/',
         replacement: 'require("@angular/compiler/esm2015/src/',
       },
@@ -180,11 +177,11 @@ const parsers = [
   },
   {
     input: "src/language-css/parser-postcss.js",
-    replaceText: [
+    replaceModule: [
       {
         // `postcss-values-parser` uses constructor.name, it will be changed by bundler
         // https://github.com/shellscape/postcss-values-parser/blob/c00f858ab8c86ce9f06fdb702e8f26376f467248/lib/parser.js#L499
-        file: require.resolve("postcss-values-parser/lib/parser.js"),
+        module: require.resolve("postcss-values-parser/lib/parser.js"),
         find: "node.constructor.name === 'Word'",
         replacement: "node.type === 'word'",
       },
@@ -195,10 +192,12 @@ const parsers = [
   },
   {
     input: "src/language-markdown/parser-markdown.js",
-    replaceModule: {
-      [require.resolve("parse-entities/decode-entity.browser.js")]:
-        require.resolve("parse-entities/decode-entity.js"),
-    },
+    replaceModule: [
+      {
+        module: require.resolve("parse-entities/decode-entity.browser.js"),
+        path: require.resolve("parse-entities/decode-entity.js"),
+      },
+    ],
   },
   {
     input: "src/language-handlebars/parser-glimmer.js",
@@ -208,12 +207,13 @@ const parsers = [
   },
   {
     input: "src/language-yaml/parser-yaml.js",
-    replaceModule: {
+    replaceModule: [
       // Use `tslib.es6.js`, so we can avoid `globalThis` shim
-      [require.resolve("tslib")]: require
-        .resolve("tslib")
-        .replace(/tslib\.js$/, "tslib.es6.js"),
-    },
+      {
+        module: require.resolve("tslib"),
+        path: require.resolve("tslib").replace(/tslib\.js$/, "tslib.es6.js"),
+      },
+    ],
   },
 ].map((bundle) => {
   const { name } = bundle.input.match(
@@ -233,14 +233,14 @@ const parsers = [
 const coreBundles = [
   {
     input: "src/index.js",
-    replaceText: [
+    replaceModule: [
       {
-        file: require.resolve("@iarna/toml/lib/toml-parser.js"),
+        module: require.resolve("@iarna/toml/lib/toml-parser.js"),
         find: "const utilInspect = eval(\"require('util').inspect\")",
         replacement: "const utilInspect = require('util').inspect",
       },
+      replaceDiffPackageEntry("lib/diff/array.js"),
     ],
-    replaceModule: replaceDiffPackageEntry("lib/diff/array.js"),
   },
   {
     input: "src/document/index.js",
@@ -254,14 +254,17 @@ const coreBundles = [
     input: "src/standalone.js",
     name: "prettier",
     target: "universal",
-    replaceModule: {
-      [require.resolve("@babel/highlight")]: require.resolve(
-        "./shims/babel-highlight.cjs"
-      ),
-      [createRequire(require.resolve("vnopts")).resolve("chalk")]:
-        require.resolve("./shims/chalk.cjs"),
-      ...replaceDiffPackageEntry("lib/diff/array.js"),
-    },
+    replaceModule: [
+      {
+        module: require.resolve("@babel/highlight"),
+        path: require.resolve("./shims/babel-highlight.cjs"),
+      },
+      {
+        module: createRequire(require.resolve("vnopts")).resolve("chalk"),
+        path: require.resolve("./shims/chalk.cjs"),
+      },
+      replaceDiffPackageEntry("lib/diff/array.js"),
+    ],
   },
   {
     input: "bin/prettier.js",
@@ -273,16 +276,17 @@ const coreBundles = [
     input: "src/cli/index.js",
     output: "cli.js",
     external: ["benchmark"],
-    replaceModule: replaceDiffPackageEntry("lib/patch/create.js"),
+    replaceModule: [replaceDiffPackageEntry("lib/patch/create.js")],
   },
   {
     input: "src/common/third-party.js",
-    replaceModule: {
+    replaceModule: [
       // cosmiconfig@6 -> import-fresh can't find parentModule, since module is bundled
-      [require.resolve("parent-module")]: require.resolve(
-        "./shims/parent-module.cjs"
-      ),
-    },
+      {
+        module: require.resolve("parent-module"),
+        path: require.resolve("./shims/parent-module.cjs"),
+      },
+    ],
   },
 ].map((bundle) => ({
   type: "core",

scripts/build/esbuild-plugins/license.mjs

@@ -10,6 +10,10 @@ export default function esbuildPluginLicense(options) {
       build.initialOptions.metafile = true;
 
       build.onEnd((result) => {
+        if (result.errors.length > 0) {
+          return;
+        }
+
         const files = Object.keys(result.metafile.inputs);
         const chunk = {
           modules: Object.fromEntries(

scripts/build/esbuild-plugins/replace-module.mjs

@@ -1,62 +1,208 @@
-export default function esbuildPluginReplaceModule(replacements = {}) {
-  const pathReplacements = new Map();
-  const contentsReplacements = new Map();
+import fs from "node:fs/promises";
 
-  for (let [file, options] of Object.entries(replacements)) {
-    if (typeof options === "string") {
-      options = { path: options };
+const DEFAULT_ON_RESOLVE_CONCEPTS = { filter: /./, namespace: "file" };
+const DEFAULT_ON_LOAD_CONCEPTS = {
+  filter: /.(?:js|json|mjs|cjs)$/,
+  namespace: "file",
+};
+
+function processReplacements(replacements) {
+  const onResolveReplacements = new Map();
+  const onLoadReplacements = new Map();
+  const onLoadProcessors = new Map();
+
+  const checkPathReplaced = (module) => {
+    if (!onResolveReplacements.has(module)) {
+      return;
     }
 
-    if (Reflect.has(options, "path")) {
-      pathReplacements.set(file, options);
+    throw new Error(`module: '${module}' already replaced with another path.`);
+  };
+
+  const checkTextReplaced = (module) => {
+    if (!onLoadReplacements.has(module)) {
+      return;
+    }
+
+    throw new Error(
+      `module: '${module}' already replaced with another content.`
+    );
+  };
+
+  for (const replacement of replacements) {
+    const { module } = replacement;
+
+    if (typeof module !== "string") {
+      throw new TypeError("'module' option is required.");
+    }
+
+    if (
+      Reflect.has(replacement, "external") ||
+      Reflect.has(replacement, "path")
+    ) {
+      if (module === "*") {
+        throw new Error("Can not replace all modules with the same path.");
+      }
+
+      checkPathReplaced(module);
+
+      onResolveReplacements.set(
+        module,
+        Reflect.has(replacement, "external")
+          ? { external: true, path: replacement.external }
+          : { path: replacement.path }
+      );
+
       continue;
     }
 
-    if (Reflect.has(options, "contents")) {
-      contentsReplacements.set(file, options);
+    if (Reflect.has(replacement, "text")) {
+      if (module === "*") {
+        throw new Error("Can not replace all modules with the same content.");
+      }
+
+      checkPathReplaced(module);
+      checkTextReplaced(module);
+
+      onLoadReplacements.set(module, {
+        contents: replacement.text,
+        loader: replacement.loader,
+      });
+
       continue;
     }
 
-    throw new Error("'path' or 'contents' is required.");
+    checkPathReplaced(module);
+    checkTextReplaced(module);
+
+    if (!onLoadProcessors.has(module)) {
+      onLoadProcessors.set(module, []);
+    }
+
+    const processFunctions = onLoadProcessors.get(module);
+
+    if (Reflect.has(replacement, "process")) {
+      const { process } = replacement;
+      if (typeof process !== "function") {
+        throw new TypeError("'process' option should be a function.");
+      }
+
+      processFunctions.push(process);
+      continue;
+    }
+
+    if (
+      Reflect.has(replacement, "find") &&
+      Reflect.has(replacement, "replacement")
+    ) {
+      processFunctions.push((text) =>
+        text.replaceAll(replacement.find, replacement.replacement)
+      );
+      continue;
+    }
+
+    console.log(replacement);
+    throw new Error("Unexpected replacement option.");
   }
 
+  return { onResolveReplacements, onLoadReplacements, onLoadProcessors };
+}
+
+function setupOnResolveListener(build, { concepts, replacements }) {
+  if (replacements.size === 0) {
+    return;
+  }
+
+  // `build.resolve()` will call `onResolve` listener
+  // Use a `Set` to avoid infinite loop
+  const seenModules = new Set();
+  build.onResolve(concepts, async (args) => {
+    if (!(args.kind === "require-call" || args.kind === "import-statement")) {
+      return;
+    }
+
+    const key = JSON.stringify(args);
+    if (seenModules.has(key)) {
+      return;
+    }
+    seenModules.add(key);
+
+    const resolveResult = await build.resolve(args.path, {
+      importer: args.importer,
+      namespace: args.namespace,
+      resolveDir: args.resolveDir,
+      kind: args.kind,
+      pluginData: args.pluginData,
+    });
+
+    // `build.resolve()` seems not respecting `browser` field in `package.json`,
+    // `resolveResult` maybe not correct, return `undefined` to let esbuild process the file.
+    return replacements.get(resolveResult.path);
+  });
+}
+
+function setupOnLoadListener(build, { concepts, replacements, processors }) {
+  if (replacements.size === 0 && processors.size === 0) {
+    return;
+  }
+
+  const processFunctionsForAllModules = processors.has("*")
+    ? processors.get("*")
+    : [];
+
+  build.onLoad(concepts, async ({ path: file }) => {
+    if (replacements.has(file)) {
+      return replacements.get(file);
+    }
+
+    const processFunctions = [
+      ...processFunctionsForAllModules,
+      ...(processors.has(file) ? processors.get(file) : []),
+    ];
+
+    if (processFunctions.length === 0) {
+      return;
+    }
+
+    const original = await fs.readFile(file, "utf8");
+
+    let text = original;
+    for (const process of processFunctions) {
+      text = process(text);
+    }
+
+    // For files not JavaScript, we need add correct `loader` to the result,
+    // We can simply return `undefined` to let esbuild process the file.
+    if (original === text) {
+      return;
+    }
+
+    return { contents: text };
+  });
+}
+
+export default function esbuildPluginReplaceModule({
+  onLoadConcepts = DEFAULT_ON_LOAD_CONCEPTS,
+  onResolveConcepts = DEFAULT_ON_RESOLVE_CONCEPTS,
+  replacements,
+}) {
+  const { onResolveReplacements, onLoadReplacements, onLoadProcessors } =
+    processReplacements(replacements);
+  const onResolveListenerOptions = {
+    concepts: onResolveConcepts,
+    replacements: onResolveReplacements,
+  };
+  const onLoadListenerOptions = {
+    concepts: onLoadConcepts,
+    replacements: onLoadReplacements,
+    processors: onLoadProcessors,
+  };
+
   return {
     name: "replace-module",
     setup(build) {
-      // `build.resolve()` will call `onResolve` listener
-      // Avoid infinite loop
-      const seen = new Set();
-
-      build.onResolve({ filter: /./ }, async (args) => {
-        if (
-          !(args.kind === "require-call" || args.kind === "import-statement") ||
-          args.namespace !== "file"
-        ) {
-          return;
-        }
-
-        const key = JSON.stringify(args);
-        if (seen.has(key)) {
-          return;
-        }
-        seen.add(key);
-
-        const resolveResult = await build.resolve(args.path, {
-          importer: args.importer,
-          namespace: args.namespace,
-          resolveDir: args.resolveDir,
-          kind: args.kind,
-          pluginData: args.pluginData,
-        });
-
-        // `build.resolve()` seems not respecting `browser` field in `package.json`
-        // Return `undefined` instead of `resolveResult` so esbuild can resolve correctly
-        return pathReplacements.get(resolveResult.path);
-      });
-
-      build.onLoad({ filter: /./ }, ({ path }) =>
-        contentsReplacements.get(path)
-      );
+      setupOnResolveListener(build, onResolveListenerOptions);
+      setupOnLoadListener(build, onLoadListenerOptions);
     },
   };
 }

scripts/build/esbuild-plugins/replace-text.mjs

@@ -1,34 +0,0 @@
-import fs from "node:fs/promises";
-
-function replaceText(text, options) {
-  return text.replaceAll(options.find, options.replacement);
-}
-
-export default function esbuildPluginReplaceText({
-  filter = /./,
-  replacements,
-}) {
-  for (const replacement of replacements) {
-    if (!replacement.file) {
-      throw new Error("'file' option is required.");
-    }
-  }
-
-  return {
-    name: "replace-text",
-    setup(build) {
-      build.onLoad({ filter }, async ({ path: file }) => {
-        let text = await fs.readFile(file, "utf8");
-
-        for (const replacement of replacements) {
-          if (replacement.file !== "*" && replacement.file !== file) {
-            continue;
-          }
-          text = replaceText(text, replacement);
-        }
-
-        return { contents: text };
-      });
-    },
-  };
-}

scripts/build/esbuild-plugins/throw-warnings.mjs

@@ -7,8 +7,12 @@ export default function esbuildPluginThrowWarnings() {
   return {
     name: "throw-warnings",
     setup(build) {
-      build.onEnd(({ warnings }) => {
-        for (const warning of warnings) {
+      build.onEnd((result) => {
+        if (result.errors.length > 0) {
+          return;
+        }
+
+        for (const warning of result.warnings) {
           if (ignoredWarnings.has(warning.text)) {
             continue;
           }

scripts/build/esbuild-plugins/umd.mjs

@@ -92,7 +92,11 @@ export default function esbuildPluginUmd({ name }) {
       options.globalName = temporaryName;
       options.format = "iife";
 
-      build.onEnd(() => {
+      build.onEnd((result) => {
+        if (result.errors.length > 0) {
+          return;
+        }
+
         if (!fs.existsSync(outfile)) {
           throw new Error(`${outfile} not exists`);
         }