@lynx-js/external-bundle-rsbuild-plugin-canary 0.0.0 → 0.0.1-canary-20251223-23796630

package/CHANGELOG.md

@@ -0,0 +1,28 @@
+# @lynx-js/external-bundle-rsbuild-plugin
+
+## 0.0.1-canary-20251223110143-23796630019f144e5ef03fe1788e71c60f7719b3
+
+### Patch Changes
+
+- Introduce `@lynx-js/external-bundle-rsbuild-plugin`. ([#2006](https://github.com/lynx-family/lynx-stack/pull/2006))
+
+  ```ts
+  // lynx.config.ts
+  import { pluginExternalBundle } from "@lynx-js/external-bundle-rsbuild-plugin";
+  import { pluginReactLynx } from "@lynx-js/react-rsbuild-plugin";
+
+  export default {
+    plugins: [
+      pluginReactLynx(),
+      pluginExternalBundle({
+        externals: {
+          lodash: {
+            url: "http://lodash.lynx.bundle",
+            background: { sectionPath: "background" },
+            mainThread: { sectionPath: "mainThread" },
+          },
+        },
+      }),
+    ],
+  };
+  ```

package/README.md

@@ -0,0 +1,53 @@
+<p align="center">
+  <a href="https://lynxjs.org/rspeedy" target="blank"><img src="https://lf-lynx.tiktok-cdns.com/obj/lynx-artifacts-oss-sg/lynx-website/assets/rspeedy-banner.png" alt="Rspeedy Logo" /></a>
+</p>
+
+<p>
+  <a aria-label="NPM version" href="https://www.npmjs.com/package/@lynx-js/external-bundle-rsbuild-plugin">
+    <img alt="" src="https://img.shields.io/npm/v/@lynx-js/external-bundle-rsbuild-plugin?logo=npm">
+  </a>
+  <a aria-label="License" href="https://www.npmjs.com/package/@lynx-js/external-bundle-rsbuild-plugin">
+    <img src="https://img.shields.io/badge/License-Apache--2.0-blue" alt="license" />
+  </a>
+</p>
+
+## Getting Started
+
+```bash
+npm install -D @lynx-js/external-bundle-rsbuild-plugin
+```
+
+## Usage
+
+```ts
+// lynx.config.ts
+import { pluginExternalBundle } from '@lynx-js/external-bundle-rsbuild-plugin'
+import { pluginReactLynx } from '@lynx-js/react-rsbuild-plugin'
+
+export default {
+  plugins: [
+    pluginReactLynx(),
+    pluginExternalBundle({
+      externals: {
+        lodash: {
+          url: 'http://lodash.lynx.bundle',
+          background: { sectionPath: 'background' },
+          mainThread: { sectionPath: 'mainThread' },
+        },
+      },
+    }),
+  ],
+}
+```
+
+## Documentation
+
+Visit [Lynx Website](https://lynxjs.org/api/rspeedy/external-bundle-rsbuild-plugin) to view the full documentation.
+
+## Contributing
+
+Contributions to Rspeedy are welcome and highly appreciated. However, before you jump right into it, we would like you to review our [Contribution Guidelines](/CONTRIBUTING.md) to make sure you have a smooth experience contributing to this project.
+
+## License
+
+Rspeedy is Apache-2.0 licensed.

package/lib/index.d.ts

@@ -0,0 +1,44 @@
+/**
+ * @packageDocumentation
+ *
+ * A rsbuild plugin for loading external bundles using externals-loading-webpack-plugin.
+ */
+import type { RsbuildPlugin } from '@rsbuild/core';
+import type { ExternalsLoadingPluginOptions } from '@lynx-js/externals-loading-webpack-plugin';
+/**
+ * Options for the external-bundle-rsbuild-plugin.
+ *
+ * @public
+ */
+export type PluginExternalBundleOptions = Pick<ExternalsLoadingPluginOptions, 'externals'>;
+/**
+ * Create a rsbuild plugin for loading external bundles.
+ *
+ * This plugin wraps the externals-loading-webpack-plugin and automatically
+ * retrieves layer names from the react-rsbuild-plugin via api.useExposed.
+ *
+ * @example
+ * ```ts
+ * // lynx.config.ts
+ * import { pluginExternalBundle } from '@lynx-js/external-bundle-rsbuild-plugin'
+ * import { pluginReactLynx } from '@lynx-js/react-rsbuild-plugin'
+ *
+ * export default {
+ *   plugins: [
+ *     pluginReactLynx(),
+ *     pluginExternalBundle({
+ *       externals: {
+ *         lodash: {
+ *           url: 'http://lodash.lynx.bundle',
+ *           background: { sectionPath: 'background' },
+ *           mainThread: { sectionPath: 'mainThread' },
+ *         },
+ *       },
+ *     }),
+ *   ],
+ * }
+ * ```
+ *
+ * @public
+ */
+export declare function pluginExternalBundle(options: PluginExternalBundleOptions): RsbuildPlugin;

package/lib/index.js

@@ -0,0 +1,56 @@
+// Copyright 2024 The Lynx Authors. All rights reserved.
+// Licensed under the Apache License Version 2.0 that can be found in the
+// LICENSE file in the root directory of this source tree.
+import { ExternalsLoadingPlugin } from '@lynx-js/externals-loading-webpack-plugin';
+/**
+ * Create a rsbuild plugin for loading external bundles.
+ *
+ * This plugin wraps the externals-loading-webpack-plugin and automatically
+ * retrieves layer names from the react-rsbuild-plugin via api.useExposed.
+ *
+ * @example
+ * ```ts
+ * // lynx.config.ts
+ * import { pluginExternalBundle } from '@lynx-js/external-bundle-rsbuild-plugin'
+ * import { pluginReactLynx } from '@lynx-js/react-rsbuild-plugin'
+ *
+ * export default {
+ *   plugins: [
+ *     pluginReactLynx(),
+ *     pluginExternalBundle({
+ *       externals: {
+ *         lodash: {
+ *           url: 'http://lodash.lynx.bundle',
+ *           background: { sectionPath: 'background' },
+ *           mainThread: { sectionPath: 'mainThread' },
+ *         },
+ *       },
+ *     }),
+ *   ],
+ * }
+ * ```
+ *
+ * @public
+ */
+export function pluginExternalBundle(options) {
+    return {
+        name: 'lynx:external-bundle',
+        setup(api) {
+            api.modifyRspackConfig((config) => {
+                // Get layer names from react-rsbuild-plugin
+                const LAYERS = api.useExposed(Symbol.for('LAYERS'));
+                if (!LAYERS) {
+                    throw new Error('external-bundle-rsbuild-plugin requires exposed `LAYERS`.');
+                }
+                config.plugins = config.plugins || [];
+                config.plugins.push(new ExternalsLoadingPlugin({
+                    backgroundLayer: LAYERS.BACKGROUND,
+                    mainThreadLayer: LAYERS.MAIN_THREAD,
+                    externals: options.externals,
+                }));
+                return config;
+            });
+        },
+    };
+}
+//# sourceMappingURL=index.js.map

package/package.json

@@ -1,9 +1,50 @@
 {
   "name": "@lynx-js/external-bundle-rsbuild-plugin-canary",
-  "version": "0.0.0",
+  "version": "0.0.1-canary-20251223-23796630",
   "description": "A rsbuild plugin for loading lynx external bundles.",
-  "keywords": [],
+  "keywords": [
+    "rsbuild",
+    "Lynx",
+    "externals",
+    "bundle"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/lynx-family/lynx-stack.git",
+    "directory": "packages/rspeedy/plugin-external-bundle"
+  },
   "license": "Apache-2.0",
+  "author": {
+    "name": "Hengchang Lu",
+    "email": "luhengchang228@gmail.com"
+  },
   "type": "module",
-  "main": "index.js"
-}
+  "exports": {
+    ".": {
+      "types": "./lib/index.d.ts",
+      "default": "./lib/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "types": "./lib/index.d.ts",
+  "files": [
+    "lib",
+    "!lib/**/*.js.map",
+    "CHANGELOG.md",
+    "README.md"
+  ],
+  "dependencies": {
+    "@lynx-js/externals-loading-webpack-plugin": "npm:@lynx-js/externals-loading-webpack-plugin-canary@0.0.1"
+  },
+  "devDependencies": {
+    "@microsoft/api-extractor": "7.55.2",
+    "@rsbuild/core": "1.6.13"
+  },
+  "engines": {
+    "node": ">=18"
+  },
+  "scripts": {
+    "api-extractor": "api-extractor run --verbose",
+    "test": "pnpm -w run test --project rspeedy/externals"
+  }
+}

package/index.js

@@ -1 +0,0 @@
-export {}