docs(deps): upgrade rspress 2.0.0-beta.5

.vscode/settings.json

@@ -53,5 +53,11 @@
   "[less]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
   },
-  "typescript.tsdk": "node_modules/typescript/lib"
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "json.schemas": [
+    {
+      "fileMatch": ["**/_meta.json"],
+      "url": "./website/node_modules/rspress/meta-json-schema.json"
+    }
+  ]
 }

website/docs/en/config/lib/dts.mdx

@@ -26,25 +26,25 @@ Configure the generation of the TypeScript declaration files.
 
 Declaration files generation is an optional feature, you can set `dts: true` to enable [bundleless declaration files](/guide/advanced/dts#bundleless-declaration-files) generation.
 
-```ts title="rslib.config.ts" {5}
+```ts
 export default {
   lib: [
     {
       format: 'esm',
-      dts: true,
+      dts: true, // [!code highlight]
     },
   ],
 };
 ```
 
 If you want to disable declaration files generation, you can set `dts: false` or do not specify the `dts` option.
 
-```ts title="rslib.config.ts" {5}
+```ts title="rslib.config.ts"
 export default {
   lib: [
     {
       format: 'esm',
-      dts: false,
+      dts: false, // [!code highlight]
     },
   ],
 };
@@ -73,14 +73,15 @@ import { PackageManagerTabs } from '@theme';
 
 2. Set `dts.bundle` to `true`.
 
-```ts title="rslib.config.ts" {5-7}
+```ts title="rslib.config.ts"
 export default {
   lib: [
     {
       format: 'esm',
       dts: {
-        bundle: true,
-      },
+        // [!code highlight]
+        bundle: true, // [!code highlight]
+      }, // [!code highlight]
     },
   ],
 };
@@ -106,14 +107,15 @@ The default value follows the priority below:
 
 #### Example
 
-```ts title="rslib.config.ts" {5-7}
+```ts title="rslib.config.ts"
 export default {
   lib: [
     {
       format: 'esm',
       dts: {
-        distPath: './dist-types',
-      },
+        // [!code highlight]
+        distPath: './dist-types', // [!code highlight]
+      }, // [!code highlight]
     },
   ],
 };
@@ -143,14 +145,15 @@ By default, type errors will cause the build to fail.
 
 When `abortOnError` is set to `false` like below, the build will still succeed even if there are type issues in the code.
 
-```ts title="rslib.config.ts" {5-7}
+```ts title="rslib.config.ts"
 export default {
   lib: [
     {
       format: 'esm',
       dts: {
-        abortOnError: false,
-      },
+        // [!code highlight]
+        abortOnError: false, // [!code highlight]
+      }, // [!code highlight]
     },
   ],
 };

website/docs/en/config/lib/external-helpers.mdx

@@ -29,20 +29,21 @@ export default class FOO {
 
 When `externalHelpers` is disabled, the output JavaScript will inline helper functions.
 
-```ts title="rslib.config.ts" {5}
+```ts title="rslib.config.ts"
 export default {
   lib: [
     {
       syntax: 'es5',
-      externalHelpers: false,
+      externalHelpers: false, // [!code highlight]
     },
   ],
 };
 ```
 
 Below is the output JavaScript file, the highlighted code is the inlined helper functions:
 
-```js title="index.js" {1-18}
+```js title="index.js"
+// [!code highlight:18]
 function _class_call_check(instance, Constructor) {
   if (!(instance instanceof Constructor))
     throw new TypeError('Cannot call a class as a function');
@@ -79,22 +80,22 @@ export { src_FOO as default };
 
 When `externalHelpers` is enabled, the output JavaScript will import helper functions from the external module `@swc/helpers`.
 
-```ts title="rslib.config.ts" {5}
+```ts title="rslib.config.ts"
 export default {
   lib: [
     {
       syntax: 'es5',
-      externalHelpers: true,
+      externalHelpers: true, // [!code highlight]
     },
   ],
 };
 ```
 
 Below is the output JavaScript file, the highlighted code is importing helper functions:
 
-```js title="index.js" {1-2}
-import * as __WEBPACK_EXTERNAL_MODULE__swc_helpers_class_call_check__ from '@swc/helpers/_/_class_call_check';
-import * as __WEBPACK_EXTERNAL_MODULE__swc_helpers_create_class__ from '@swc/helpers/_/_create_class';
+```js title="index.js"
+import * as __WEBPACK_EXTERNAL_MODULE__swc_helpers_class_call_check__ from '@swc/helpers/_/_class_call_check'; // [!code highlight]
+import * as __WEBPACK_EXTERNAL_MODULE__swc_helpers_create_class__ from '@swc/helpers/_/_create_class'; // [!code highlight]
 var src_FOO = /*#__PURE__*/ (function () {
   'use strict';
   function FOO() {

website/docs/en/config/lib/umd-name.mdx

@@ -15,12 +15,12 @@ The module name of the UMD bundle must not conflict with the global variable nam
 
 The UMD bundle will be mounted to `global.MyLibrary`.
 
-```ts title="rslib.config.ts" {5}
+```ts title="rslib.config.ts"
 export default {
   lib: [
     {
       format: 'umd',
-      umdName: 'MyLibrary',
+      umdName: 'MyLibrary', // [!code highlight]
     },
   ],
 };

website/docs/en/guide/advanced/json-files.mdx

@@ -243,19 +243,19 @@ If you want JSON / YAML / TOML files to be output to the distribution directory
 
 For example, the following configuration will output all JSON files in the `src` directory as-is:
 
-```ts title="rslib.config.ts" {7,11-12}
+```ts title="rslib.config.ts"
 export default defineConfig({
   lib: [
     {
       bundle: false,
       source: {
         entry: {
-          index: ['./src/**', '!./src/**/*.json'],
+          index: ['./src/**', '!./src/**/*.json'], // [!code highlight]
         },
       },
       output: {
-        copy: [{ from: './**/*.json', context: './src' }],
-        externals: [/.*\.json$/],
+        copy: [{ from: './**/*.json', context: './src' }], // [!code highlight]
+        externals: [/.*\.json$/], // [!code highlight]
       },
     },
   ],

website/docs/en/guide/advanced/module-federation.mdx

@@ -30,14 +30,15 @@ import { PackageManagerTabs } from '@theme';
 
 Then register the plugin in the `rslib.config.ts` file:
 
-```ts title='rslib.config.ts' {8-43}
+```ts title='rslib.config.ts'
 import { pluginModuleFederation } from '@module-federation/rsbuild-plugin';
 import { pluginReact } from '@rsbuild/plugin-react';
 import { defineConfig } from '@rslib/core';
 
 export default defineConfig({
   lib: [
     // ... other format
+    // [!code highlight:35]
     {
       format: 'mf',
       output: {
@@ -117,31 +118,31 @@ with Hot Module Replacement (HMR).
 Set up the host app to consume the Rslib Module Federation library. Check out the [@module-federation/rsbuild-plugin
 ](https://www.npmjs.com/package/@module-federation/rsbuild-plugin) for more information.
 
-```ts title="rsbuild.config.ts" {8-24}
+```ts title="rsbuild.config.ts"
 import { pluginModuleFederation } from '@module-federation/rsbuild-plugin';
 import { defineConfig } from '@rsbuild/core';
 import { pluginReact } from '@rsbuild/plugin-react';
 
 export default defineConfig({
   plugins: [
     pluginReact(),
-    pluginModuleFederation({
-      name: 'rsbuild_host',
-      remotes: {
-        rslib: 'rslib@http://localhost:3001/mf/mf-manifest.json',
-      },
-      shared: {
-        react: {
-          singleton: true,
-        },
-        'react-dom': {
-          singleton: true,
-        },
-      },
-      // Enable this when the output of Rslib is build under 'production' mode, while the host app is 'development'.
-      // Reference: https://lib.rsbuild.dev/guide/advanced/module-federation#faqs
-      shareStrategy: 'loaded-first',
-    }),
+    pluginModuleFederation({ // [!code highlight]
+      name: 'rsbuild_host', // [!code highlight]
+      remotes: { // [!code highlight]
+        rslib: 'rslib@http://localhost:3001/mf/mf-manifest.json', // [!code highlight]
+      }, // [!code highlight]
+      shared: { // [!code highlight]
+        react: { // [!code highlight]
+          singleton: true, // [!code highlight]
+        }, // [!code highlight]
+        'react-dom': { // [!code highlight]
+          singleton: true, // [!code highlight]
+        }, // [!code highlight]
+      }, // [!code highlight]
+      // Enable this when the output of Rslib is build under 'production' mode, while the host app is 'development'. // [!code highlight]
+      // Reference: https://lib.rsbuild.dev/guide/advanced/module-federation#faqs // [!code highlight]
+      shareStrategy: 'loaded-first', // [!code highlight]
+    }), // [!code highlight]
   ],
 });
 ```
@@ -181,7 +182,7 @@ First, set up Storybook with the Rslib project. You can refer to the [Storybook
 
 2. Then set up the Storybook configuration file `.storybook/main.ts`, specify the stories and addons, and set the framework with corresponding framework integration.
 
-   ```ts title=".storybook/main.ts" {18-38}
+   ```ts title=".storybook/main.ts"
    import { dirname, join } from 'node:path';
    import type { StorybookConfig } from 'storybook-react-rsbuild';
 
@@ -199,7 +200,7 @@ First, set up Storybook with the Rslib project. You can refer to the [Storybook
        options: {},
      },
      addons: [
-       {
+       { // [!code highlight:20]
          name: getAbsolutePath('storybook-addon-rslib'),
          options: {
            rslib: {
@@ -230,10 +231,10 @@ First, set up Storybook with the Rslib project. You can refer to the [Storybook
 
 Import components from remote module.
 
-```ts title="stories/index.stories.tsx" {2-3}
+```ts title="stories/index.stories.tsx"
 import React from 'react';
-// Load your remote module here, Storybook will act as the host app.
-import { Counter } from 'rslib-module';
+// Load your remote module here, Storybook will act as the host app. // [!code highlight]
+import { Counter } from 'rslib-module'; // [!code highlight]
 
 const Component = () => <Counter />;
 

website/docs/en/guide/advanced/output-compatibility.mdx

@@ -35,8 +35,8 @@ And install [core-js-pure](https://www.npmjs.com/package/core-js-pure) as the ru
 
 Configure the Babel plugin with polyfill options, set the [targets](https://babeljs.io/docs/options#targets) field to specify the target browser version.
 
-```ts title="rslib.config.ts" {1,11-24}
-import { pluginBabel } from '@rsbuild/plugin-babel';
+```ts title="rslib.config.ts"
+import { pluginBabel } from '@rsbuild/plugin-babel'; // [!code highlight]
 import { defineConfig } from '@rslib/core';
 
 export default defineConfig({
@@ -46,20 +46,20 @@ export default defineConfig({
     },
   ],
   plugins: [
-    pluginBabel({
-      babelLoaderOptions: {
-        plugins: [
-          [
-            require('babel-plugin-polyfill-corejs3'),
-            {
-              method: 'usage-pure',
-              targets: { ie: '10' },
-              version: '3.29',
-            },
-          ],
-        ],
-      },
-    }),
+    pluginBabel({ // [!code highlight]
+      babelLoaderOptions: { // [!code highlight]
+        plugins: [ // [!code highlight]
+          [ // [!code highlight]
+            require('babel-plugin-polyfill-corejs3'), // [!code highlight]
+            { // [!code highlight]
+              method: 'usage-pure', // [!code highlight]
+              targets: { ie: '10' }, // [!code highlight]
+              version: '3.29', // [!code highlight]
+            }, // [!code highlight]
+          ], // [!code highlight]
+        ], // [!code highlight]
+      }, // [!code highlight]
+    }), // [!code highlight]
   ],
 });
 ```

website/docs/en/guide/basic/output-format.mdx

@@ -97,18 +97,18 @@ The following Rslib config is an example to build a UMD library.
 - `output.externals.react: 'React'`: specify the external dependency `react` could be accessed by `window.React`.
 - `runtime: 'classic'`: use the classic runtime of React to support applications that using React version under 18.
 
-```ts title="rslib.config.ts" {7-12,22}
+```ts title="rslib.config.ts"
 import { pluginReact } from '@rsbuild/plugin-react';
 import { defineConfig } from '@rslib/core';
 
 export default defineConfig({
   lib: [
     {
-      format: 'umd',
-      umdName: 'RslibUmdExample',
+      format: 'umd', // [!code highlight]
+      umdName: 'RslibUmdExample', // [!code highlight]
       output: {
         externals: {
-          react: 'React',
+          react: 'React', // [!code highlight]
         },
         distPath: {
           root: './dist/umd',
@@ -122,7 +122,7 @@ export default defineConfig({
   plugins: [
     pluginReact({
       swcReactOptions: {
-        runtime: 'classic',
+        runtime: 'classic', // [!code highlight]
       },
     }),
   ],