feat: init @lynx-js/config-rsbuild-plugin for Lynx Configs (#2052)

<!--
  Thank you for submitting a pull request!

We appreciate the time and effort you have invested in making these
changes. Please ensure that you provide enough information to allow
others to review your pull request.

Upon submission, your pull request will be automatically assigned with
reviewers.

If you want to learn more about contributing to this project, please
visit:
https://github.com/lynx-family/lynx-stack/blob/main/CONTRIBUTING.md.
-->

See docs at: lynx-family/lynx-website#673,
[Preview](https://deploy-preview-673--lynx-doc.netlify.app/next/api/lynx-config/index.html)

<!-- The AI summary below will be auto-generated - feel free to replace
it with your own. -->

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **New Features**
* Adds a new RSBuild plugin surfaced to users, including an option to
enable inline CSS variables.
* **Documentation**
* Publishes package README, API report, and adds site navigation entries
with usage examples.
* **Tests**
* Adds unit, type-level, and integration tests covering validation,
overrides and unknown keys.
* **Chores**
* Adds package/build/test configs and updates dev-dependencies for
examples and the website.

<sub>✏️ Tip: You can customize this high-level summary in your review
settings.</sub>
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

## Checklist

<!--- Check and mark with an "x" -->

- [x] Tests updated (or not required).
- [ ] Documentation updated (or not required).
- [x] Changeset added, and when a BREAKING CHANGE occurs, it needs to be
clearly marked (or not required).

Author: upupming

.changeset/rotten-pears-follow.md

@@ -0,0 +1,21 @@
+---
+"@lynx-js/config-rsbuild-plugin": patch
+---
+
+Init `@lynx-js/config-rsbuild-plugin` for configuring Lynx Configs that are not exposed by DSL plugins.
+
+For example:
+
+```ts
+// lynx.config.ts
+import { pluginLynxConfig } from '@lynx-js/config-rsbuild-plugin';
+import { defineConfig } from '@lynx-js/rspeedy';
+
+export default defineConfig({
+  plugins: [
+    pluginLynxConfig({
+      enableCheckExposureOptimize: false,
+    }),
+  ],
+});
+```

examples/tailwindcss/lynx.config.js

@@ -1,5 +1,6 @@
 import { pluginTailwindCSS } from 'rsbuild-plugin-tailwindcss';
 
+import { pluginLynxConfig } from '@lynx-js/config-rsbuild-plugin';
 import { pluginQRCode } from '@lynx-js/qrcode-rsbuild-plugin';
 import { pluginReactLynx } from '@lynx-js/react-rsbuild-plugin';
 import { defineConfig } from '@lynx-js/rspeedy';
@@ -17,5 +18,8 @@ export default defineConfig({
       config: 'tailwind.config.ts',
       exclude: [/[\\/]node_modules[\\/]/],
     }),
+    pluginLynxConfig({
+      enableCSSInlineVariables: true,
+    }),
   ],
 });

examples/tailwindcss/package.json

@@ -14,6 +14,7 @@
     "tailwind-merge": "^3.4.0"
   },
   "devDependencies": {
+    "@lynx-js/config-rsbuild-plugin": "workspace:*",
     "@lynx-js/qrcode-rsbuild-plugin": "workspace:*",
     "@lynx-js/react-rsbuild-plugin": "workspace:*",
     "@lynx-js/rspeedy": "workspace:*",

examples/tailwindcss/tsconfig.json

@@ -18,5 +18,6 @@
     { "path": "../../packages/rspeedy/core/tsconfig.build.json" },
     { "path": "../../packages/rspeedy/plugin-qrcode/tsconfig.build.json" },
     { "path": "../../packages/rspeedy/plugin-react/tsconfig.build.json" },
+    { "path": "../../packages/rspeedy/plugin-config/tsconfig.build.json" },
   ],
 }

packages/rspeedy/plugin-config/README.md

@@ -0,0 +1,42 @@
+<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/config-rsbuild-plugin">
+    <img alt="" src="https://img.shields.io/npm/v/@lynx-js/config-rsbuild-plugin?logo=npm">
+  </a>
+  <a aria-label="License" href="https://www.npmjs.com/package/@lynx-js/config-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/config-rsbuild-plugin
+```
+
+## Usage
+
+```ts
+// lynx.config.ts
+import { pluginLynxConfig } from '@lynx-js/config-rsbuild-plugin'
+import { defineConfig } from '@lynx-js/rspeedy'
+
+export default defineConfig({
+  plugins: [
+    pluginLynxConfig({
+      enableCheckExposureOptimize: false,
+    }),
+  ],
+})
+```
+
+## 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.

packages/rspeedy/plugin-config/api-extractor.json

@@ -0,0 +1,6 @@
+/**
+ * Config file for API Extractor.  For more info, please visit: https://api-extractor.com
+ */
+{
+  "extends": "../../../api-extractor.json",
+}

packages/rspeedy/plugin-config/etc/config-rsbuild-plugin.api.md

@@ -0,0 +1,27 @@
+## API Report File for "@lynx-js/config-rsbuild-plugin"
+
+> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
+
+```ts
+
+import type { CompilerOptions } from '@lynx-js/type-config';
+import type { Config as Config_2 } from '@lynx-js/type-config';
+import type { RsbuildPlugin } from '@lynx-js/rspeedy';
+
+// @public
+export interface Config extends Config_2, CompilerOptions {
+}
+
+// @public
+export interface Options {
+    compilerOptionsKeys?: string[];
+    configKeys?: string[];
+    dslPluginName2PkgName?: Record<string, string>;
+    upgradeRspeedyLink?: string;
+    validate?: (input: unknown) => Config;
+}
+
+// @public
+export function pluginLynxConfig(config: Config, options?: Options): RsbuildPlugin;
+
+```

packages/rspeedy/plugin-config/package.json

@@ -0,0 +1,72 @@
+{
+  "name": "@lynx-js/config-rsbuild-plugin",
+  "version": "0.0.0",
+  "description": "An rsbuild plugin for config Lynx Config defined by @lynx-js/type-config.",
+  "keywords": [
+    "rsbuild",
+    "Lynx",
+    "Config"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/lynx-family/lynx-stack.git",
+    "directory": "packages/rspeedy/plugin-config"
+  },
+  "license": "Apache-2.0",
+  "author": {
+    "name": "Yiming Li",
+    "email": "yimingli.cs@gmail.com"
+  },
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./lib/index.d.ts",
+      "default": "./lib/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "types": "./lib/index.d.ts",
+  "files": [
+    "dist",
+    "CHANGELOG.md",
+    "README.md"
+  ],
+  "scripts": {
+    "api-extractor": "api-extractor run --verbose",
+    "build": "rslib build",
+    "test": "vitest"
+  },
+  "dependencies": {
+    "@lynx-js/type-config": "3.6.0"
+  },
+  "devDependencies": {
+    "@lynx-js/rspeedy": "workspace:*",
+    "@lynx-js/template-webpack-plugin": "workspace:*",
+    "@lynx-js/test-tools": "workspace:*",
+    "@rollup/plugin-typescript": "^12.3.0",
+    "@rsbuild/core": "catalog:rsbuild",
+    "@types/object.pick": "^1.3.4",
+    "object.pick": "^1.3.0",
+    "picocolors": "^1.1.1",
+    "terminal-link": "^4.0.0",
+    "typia": "10.1.0",
+    "typia-rspack-plugin": "2.2.2",
+    "webpack": "^5.104.1"
+  },
+  "peerDependencies": {
+    "@lynx-js/rspeedy": "^0.7.0 || ^0.8.0 || ^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0"
+  },
+  "engines": {
+    "node": ">=18"
+  },
+  "publishConfig": {
+    "exports": {
+      ".": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "./package.json": "./package.json"
+    },
+    "types": "./dist/index.d.ts"
+  }
+}

packages/rspeedy/plugin-config/rslib.config.ts

@@ -0,0 +1,18 @@
+import { defineConfig } from '@rslib/core'
+import { TypiaRspackPlugin } from 'typia-rspack-plugin'
+
+export default defineConfig({
+  lib: [
+    { format: 'esm', syntax: 'es2022', dts: { bundle: true } },
+  ],
+  source: {
+    tsconfigPath: './tsconfig.build.json',
+  },
+  tools: {
+    rspack: {
+      plugins: [
+        new TypiaRspackPlugin({ log: false }),
+      ],
+    },
+  },
+})

packages/rspeedy/plugin-config/src/LynxConfigWebpackPlugin.ts

@@ -0,0 +1,45 @@
+// Copyright 2025 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 pick from 'object.pick'
+import type { Compiler } from 'webpack'
+
+import type { LynxTemplatePlugin } from '@lynx-js/template-webpack-plugin'
+
+export class LynxConfigWebpackPlugin<Config extends object> {
+  constructor(
+    private options: {
+      LynxTemplatePlugin: typeof LynxTemplatePlugin
+      config: Config
+      compilerOptionsKeys: string[]
+      configKeys: string[]
+    },
+  ) {}
+
+  name = 'LynxConfigWebpackPlugin'
+
+  apply(compiler: Compiler): void {
+    compiler.hooks.thisCompilation.tap(this.name, (compilation) => {
+      const hooks = this.options.LynxTemplatePlugin.getLynxTemplatePluginHooks(
+        compilation,
+      )
+
+      hooks.beforeEncode.tap(this.name, (args) => {
+        const { config } = this.options
+
+        args.encodeData.compilerOptions = {
+          ...args.encodeData.compilerOptions,
+          ...pick(config, this.options.compilerOptionsKeys as (keyof Config)[]),
+        }
+
+        args.encodeData.sourceContent.config = {
+          ...args.encodeData.sourceContent.config,
+          ...pick(config, this.options.configKeys as (keyof Config)[]),
+        }
+
+        return args
+      })
+    })
+  }
+}