@rsbuild/core 0.1.4 → 0.1.5

package/dist/rspack-plugins/HtmlTagsPlugin.d.ts

@@ -0,0 +1,30 @@
+import type HtmlWebpackPlugin from 'html-webpack-plugin';
+import type { Compiler } from '@rspack/core';
+import { type HtmlInjectTag, type HtmlInjectTagDescriptor } from '@rsbuild/shared';
+export interface HtmlTagsPluginOptions {
+  hash?: HtmlInjectTag['hash'];
+  publicPath?: HtmlInjectTag['publicPath'];
+  append?: HtmlInjectTag['append'];
+  includes?: string[];
+  tags?: HtmlInjectTagDescriptor[];
+  HtmlPlugin: typeof HtmlWebpackPlugin;
+}
+export interface AdditionalContext {
+  HtmlPlugin: Extract<HtmlTagsPluginOptions['HtmlPlugin'], Function>;
+}
+export type Context = Omit<HtmlTagsPluginOptions, keyof AdditionalContext> & AdditionalContext;
+/** @see {@link https://developer.mozilla.org/en-US/docs/Glossary/Void_element} */
+export declare const VOID_TAGS: string[];
+/** @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/head#see_also} */
+export declare const HEAD_TAGS: string[];
+export declare const FILE_ATTRS: {
+  link: string;
+  script: string;
+};
+export declare class HtmlTagsPlugin {
+  readonly name: string;
+  meta: Record<string, string>;
+  ctx: Context;
+  constructor(opts: HtmlTagsPluginOptions);
+  apply(compiler: Compiler): void;
+}

package/dist/rspack-plugins/HtmlTagsPlugin.js

@@ -0,0 +1,173 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var HtmlTagsPlugin_exports = {};
+__export(HtmlTagsPlugin_exports, {
+  FILE_ATTRS: () => FILE_ATTRS,
+  HEAD_TAGS: () => HEAD_TAGS,
+  HtmlTagsPlugin: () => HtmlTagsPlugin,
+  VOID_TAGS: () => VOID_TAGS
+});
+module.exports = __toCommonJS(HtmlTagsPlugin_exports);
+var import_shared = require("@rsbuild/shared");
+const VOID_TAGS = [
+  "area",
+  "base",
+  "br",
+  "col",
+  "embed",
+  "hr",
+  "img",
+  "input",
+  "keygen",
+  "link",
+  "meta",
+  "param",
+  "source",
+  "track",
+  "wbr"
+];
+const HEAD_TAGS = [
+  "title",
+  "base",
+  "link",
+  "style",
+  "meta",
+  "script",
+  "noscript",
+  "template"
+];
+const FILE_ATTRS = {
+  link: "href",
+  script: "src"
+};
+const withHash = (url, hash) => `${url}?${hash}`;
+class HtmlTagsPlugin {
+  constructor(opts) {
+    this.name = "HtmlTagsPlugin";
+    this.meta = { plugin: this.name };
+    this.ctx = {
+      append: true,
+      ...opts
+    };
+  }
+  apply(compiler) {
+    compiler.hooks.compilation.tap(this.name, (compilation) => {
+      const compilationHash = compilation.hash || "";
+      const hooks = this.ctx.HtmlPlugin.getHooks(compilation);
+      hooks.alterAssetTagGroups.tap(this.name, (params) => {
+        const includesCurrentFile = !this.ctx.includes || this.ctx.includes.includes(params.outputName);
+        if (!includesCurrentFile || !this.ctx.tags?.length) {
+          return params;
+        }
+        const fromWebpackTags = (tags2, override) => {
+          const ret = [];
+          for (const tag of tags2) {
+            ret.push({
+              tag: tag.tagName,
+              attrs: tag.attributes,
+              children: tag.innerHTML,
+              publicPath: false,
+              ...override
+            });
+          }
+          return ret;
+        };
+        const fromInjectTags = (tags2) => {
+          const ret = [];
+          for (const tag of tags2) {
+            const attrs = { ...tag.attrs };
+            const filenameTag = FILE_ATTRS[tag.tag];
+            let filename = attrs[filenameTag];
+            if (typeof filename === "string") {
+              const optPublicPath = tag.publicPath ?? this.ctx.publicPath;
+              if (typeof optPublicPath === "function") {
+                filename = optPublicPath(filename, params.publicPath);
+              } else if (typeof optPublicPath === "string") {
+                filename = (0, import_shared.withPublicPath)(filename, optPublicPath);
+              } else if (optPublicPath !== false) {
+                filename = (0, import_shared.withPublicPath)(filename, params.publicPath);
+              }
+              const optHash = tag.hash ?? this.ctx.hash;
+              if (typeof optHash === "function") {
+                compilationHash.length && (filename = optHash(filename, compilationHash));
+              } else if (typeof optHash === "string") {
+                optHash.length && (filename = withHash(filename, optHash));
+              } else if (optHash === true) {
+                compilationHash.length && (filename = withHash(filename, compilationHash));
+              }
+              attrs[filenameTag] = filename;
+            }
+            ret.push({
+              tagName: tag.tag,
+              attributes: attrs,
+              meta: this.meta,
+              voidTag: VOID_TAGS.includes(tag.tag),
+              innerHTML: tag.children
+            });
+          }
+          return ret;
+        };
+        const handlers = [];
+        let tags = [
+          ...fromWebpackTags(params.headTags, { head: true }),
+          ...fromWebpackTags(params.bodyTags, { head: false })
+        ];
+        this.ctx.tags.forEach((tag) => {
+          if ((0, import_shared.isFunction)(tag)) {
+            handlers.push(tag);
+          } else {
+            tags.push(tag);
+          }
+        });
+        const getPriority = (tag) => {
+          const head = tag.head ?? HEAD_TAGS.includes(tag.tag);
+          let priority = head ? -2 : 2;
+          const append = tag.append ?? this.ctx.append;
+          if (typeof append === "boolean") {
+            priority += append ? 1 : -1;
+          }
+          return priority;
+        };
+        tags = tags.sort((tag1, tag2) => getPriority(tag1) - getPriority(tag2));
+        const utils = {
+          outputName: params.outputName,
+          publicPath: params.publicPath,
+          hash: compilationHash
+        };
+        for (const handler of handlers) {
+          tags = handler(tags, utils) || tags;
+        }
+        const [headTags, bodyTags] = (0, import_shared.partition)(
+          tags,
+          (tag) => tag.head ?? HEAD_TAGS.includes(tag.tag)
+        );
+        params.headTags = fromInjectTags(headTags);
+        params.bodyTags = fromInjectTags(bodyTags);
+        return params;
+      });
+    });
+  }
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  FILE_ATTRS,
+  HEAD_TAGS,
+  HtmlTagsPlugin,
+  VOID_TAGS
+});

package/dist/rspack-plugins/InlineChunkHtmlPlugin.d.ts

@@ -0,0 +1,57 @@
+import { type InlineChunkTest } from '@rsbuild/shared';
+import type { Compiler, Compilation } from '@rspack/core';
+import type HtmlWebpackPlugin from 'html-webpack-plugin';
+import type { HtmlTagObject } from 'html-webpack-plugin';
+export type InlineChunkHtmlPluginOptions = {
+  styleTests: InlineChunkTest[];
+  scriptTests: InlineChunkTest[];
+  distPath: {
+    js?: string;
+    css?: string;
+  };
+};
+export declare class InlineChunkHtmlPlugin {
+  name: string;
+  styleTests: InlineChunkTest[];
+  scriptTests: InlineChunkTest[];
+  distPath: InlineChunkHtmlPluginOptions['distPath'];
+  inlinedAssets: Set<string>;
+  htmlPlugin: typeof HtmlWebpackPlugin;
+  constructor(htmlPlugin: typeof HtmlWebpackPlugin, {
+    styleTests,
+    scriptTests,
+    distPath
+  }: InlineChunkHtmlPluginOptions);
+  /**
+   * If we inlined the chunk to HTML,we should update the value of sourceMappingURL,
+   * because the relative path of source code has been changed.
+   * @param source
+   */
+  updateSourceMappingURL({
+    source,
+    compilation,
+    publicPath,
+    type
+  }: {
+    source: string;
+    compilation: Compilation;
+    publicPath: string;
+    type: 'js' | 'css';
+  }): string;
+  matchTests(name: string, source: string, tests: InlineChunkTest[]): boolean;
+  getInlinedScriptTag(publicPath: string, tag: HtmlTagObject, compilation: Compilation): HtmlWebpackPlugin.HtmlTagObject | {
+    tagName: string;
+    innerHTML: string;
+    attributes: {
+      [x: string]: string | boolean | null | undefined;
+    };
+    closeTag: boolean;
+  };
+  getInlinedCSSTag(publicPath: string, tag: HtmlTagObject, compilation: Compilation): HtmlWebpackPlugin.HtmlTagObject | {
+    tagName: string;
+    innerHTML: string;
+    closeTag: boolean;
+  };
+  getInlinedTag(publicPath: string, tag: HtmlTagObject, compilation: Compilation): HtmlWebpackPlugin.HtmlTagObject;
+  apply(compiler: Compiler): void;
+}

package/dist/rspack-plugins/InlineChunkHtmlPlugin.js

@@ -0,0 +1,182 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var InlineChunkHtmlPlugin_exports = {};
+__export(InlineChunkHtmlPlugin_exports, {
+  InlineChunkHtmlPlugin: () => InlineChunkHtmlPlugin
+});
+module.exports = __toCommonJS(InlineChunkHtmlPlugin_exports);
+var import_path = require("path");
+var import_shared = require("@rsbuild/shared");
+class InlineChunkHtmlPlugin {
+  constructor(htmlPlugin, { styleTests, scriptTests, distPath }) {
+    this.name = "InlineChunkHtmlPlugin";
+    this.styleTests = styleTests;
+    this.scriptTests = scriptTests;
+    this.distPath = distPath;
+    this.inlinedAssets = /* @__PURE__ */ new Set();
+    this.htmlPlugin = htmlPlugin;
+  }
+  /**
+   * If we inlined the chunk to HTML,we should update the value of sourceMappingURL,
+   * because the relative path of source code has been changed.
+   * @param source
+   */
+  updateSourceMappingURL({
+    source,
+    compilation,
+    publicPath,
+    type
+  }) {
+    const { devtool } = compilation.options;
+    if (devtool && // If the source map is inlined, we do not need to update the sourceMappingURL
+    !devtool.includes("inline") && source.includes("# sourceMappingURL")) {
+      const prefix = (0, import_shared.addTrailingSlash)(
+        (0, import_path.join)(publicPath, this.distPath[type] || "")
+      );
+      return source.replace(
+        /# sourceMappingURL=/,
+        `# sourceMappingURL=${prefix}`
+      );
+    }
+    return source;
+  }
+  matchTests(name, source, tests) {
+    return tests.some((test) => {
+      if ((0, import_shared.isFunction)(test)) {
+        const size = source.length;
+        return test({ name, size });
+      }
+      return test.exec(name);
+    });
+  }
+  getInlinedScriptTag(publicPath, tag, compilation) {
+    const { assets } = compilation;
+    if (!(tag?.attributes.src && typeof tag.attributes.src === "string")) {
+      return tag;
+    }
+    const { src, ...otherAttrs } = tag.attributes;
+    const scriptName = publicPath ? src.replace(publicPath, "") : src;
+    const asset = assets[scriptName];
+    if (asset == null) {
+      return tag;
+    }
+    const source = asset.source().toString();
+    const shouldInline = this.matchTests(scriptName, source, this.scriptTests);
+    if (!shouldInline) {
+      return tag;
+    }
+    const ret = {
+      tagName: "script",
+      innerHTML: this.updateSourceMappingURL({
+        source,
+        compilation,
+        publicPath,
+        type: "js"
+      }),
+      attributes: {
+        ...otherAttrs
+      },
+      closeTag: true
+    };
+    this.inlinedAssets.add(scriptName);
+    return ret;
+  }
+  getInlinedCSSTag(publicPath, tag, compilation) {
+    const { assets } = compilation;
+    if (!(tag.attributes.href && typeof tag.attributes.href === "string")) {
+      return tag;
+    }
+    const linkName = publicPath ? tag.attributes.href.replace(publicPath, "") : tag.attributes.href;
+    const asset = assets[linkName];
+    if (asset == null) {
+      return tag;
+    }
+    const source = asset.source().toString();
+    const shouldInline = this.matchTests(linkName, source, this.styleTests);
+    if (!shouldInline) {
+      return tag;
+    }
+    const ret = {
+      tagName: "style",
+      innerHTML: this.updateSourceMappingURL({
+        source,
+        compilation,
+        publicPath,
+        type: "css"
+      }),
+      closeTag: true
+    };
+    this.inlinedAssets.add(linkName);
+    return ret;
+  }
+  getInlinedTag(publicPath, tag, compilation) {
+    if (tag.tagName === "script") {
+      return this.getInlinedScriptTag(
+        publicPath,
+        tag,
+        compilation
+      );
+    }
+    if (tag.tagName === "link" && tag.attributes && tag.attributes.rel === "stylesheet") {
+      return this.getInlinedCSSTag(
+        publicPath,
+        tag,
+        compilation
+      );
+    }
+    return tag;
+  }
+  apply(compiler) {
+    compiler.hooks.compilation.tap(this.name, (compilation) => {
+      const publicPath = (0, import_shared.getPublicPathFromCompiler)(compiler);
+      const tagFunction = (tag) => this.getInlinedTag(publicPath, tag, compilation);
+      const hooks = this.htmlPlugin.getHooks(compilation);
+      hooks.alterAssetTagGroups.tap(this.name, (assets) => {
+        assets.headTags = assets.headTags.map(tagFunction);
+        assets.bodyTags = assets.bodyTags.map(tagFunction);
+        return assets;
+      });
+      compilation.hooks.processAssets.tap(
+        {
+          name: "InlineChunkHtmlPlugin",
+          /**
+           * Remove marked inline assets in summarize stage,
+           * which should be later than the emitting of html-webpack-plugin
+           */
+          stage: import_shared.COMPILATION_PROCESS_STAGE.PROCESS_ASSETS_STAGE_SUMMARIZE
+        },
+        () => {
+          const { devtool } = compiler.options;
+          this.inlinedAssets.forEach((name) => {
+            if (devtool === "hidden-source-map") {
+              compilation.deleteAsset(name);
+            } else {
+              delete compilation.assets[name];
+            }
+          });
+          this.inlinedAssets.clear();
+        }
+      );
+    });
+  }
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  InlineChunkHtmlPlugin
+});

package/dist/rspack-provider/core/createContext.js

@@ -47,10 +47,14 @@ function getDefaultEntry(root) {
   }
   return {};
 }
+function getAbsoluteDistPath(cwd, outputConfig) {
+  const root = (0, import_shared.getDistPath)(outputConfig, "root");
+  return (0, import_path.isAbsolute)(root) ? root : (0, import_path.join)(cwd, root);
+}
 function createContextByConfig(options, bundlerType, sourceConfig = {}, outputConfig = {}) {
   const { cwd, target } = options;
   const rootPath = cwd;
-  const distPath = (0, import_shared.getAbsoluteDistPath)(cwd, outputConfig);
+  const distPath = getAbsoluteDistPath(cwd, outputConfig);
   const cachePath = (0, import_path.join)(rootPath, "node_modules", ".cache");
   if (sourceConfig.entries) {
     import_shared.logger.warn(
@@ -64,7 +68,7 @@ function createContextByConfig(options, bundlerType, sourceConfig = {}, outputCo
     entry: sourceConfig.entry || // TODO: remove sourceConfig.entries in v0.2.0
     // compat with previous config
     sourceConfig.entries || getDefaultEntry(rootPath),
-    version: "0.1.4",
+    version: "0.1.5",
     target,
     rootPath,
     distPath,
@@ -74,7 +78,7 @@ function createContextByConfig(options, bundlerType, sourceConfig = {}, outputCo
   return context;
 }
 function updateContextByNormalizedConfig(context, config) {
-  context.distPath = (0, import_shared.getAbsoluteDistPath)(context.rootPath, config.output);
+  context.distPath = getAbsoluteDistPath(context.rootPath, config.output);
   if (config.source.entry) {
     context.entry = config.source.entry;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rsbuild/core",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "Unleash the power of Rspack with the out-of-the-box build tool.",
   "homepage": "https://rsbuild.dev",
   "bugs": {
@@ -58,17 +58,18 @@
     "types.d.ts"
   ],
   "dependencies": {
-    "@rspack/core": "0.4.0-canary-d45e3e0-20231128075052",
+    "@rspack/core": "0.4.1",
     "core-js": "~3.32.2",
     "html-webpack-plugin": "npm:html-rspack-plugin@5.5.7",
     "postcss": "8.4.31",
     "semver": "^7.5.4",
-    "@rsbuild/shared": "0.1.4"
+    "@rsbuild/shared": "0.1.5"
   },
   "devDependencies": {
     "@types/node": "^16",
     "@types/semver": "^7.5.4",
-    "typescript": "^5.3.0"
+    "typescript": "^5.3.0",
+    "webpack": "^5.89.0"
   },
   "engines": {
     "node": ">=14.0.0"