@modern-js/app-tools 3.9.2 → 3.10.0

package/docs/configure/app/tools/less.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # tools.less
 
 - **Type:** `Object | Function`
@@ -5,49 +7,78 @@
 
 ```js
 const defaultOptions = {
-  lessOptions: {
-    javascriptEnabled: true,
+  lessLoaderOptions: {
+    lessOptions: {
+      javascriptEnabled: true,
+    },
+    // CSS Source Map enabled by default in development environment
+    sourceMap: isDev,
   },
-  // CSS Source Map enabled by default in development environment
-  sourceMap: isDev,
 };
 ```
 
-You can modify the config of [less-loader](https://github.com/webpack-contrib/less-loader) via `tools.less`.
+`tools.less` modifies the options of [@rsbuild/plugin-less](https://rsbuild.rs/plugins/list/plugin-less). It accepts the full plugin options:
 
-### Object Type
+| Option              | Description                                                                                         |
+| ------------------- | --------------------------------------------------------------------------------------------------- |
+| `lessLoaderOptions` | Options passed to [less-loader](https://github.com/webpack-contrib/less-loader), object or function |
+| `include`           | Files handled by less-loader, defaults to `/\.less$/`                                               |
+| `exclude`           | Files that less-loader should skip                                                                  |
+| `parallel`          | Whether to compile Less modules in worker threads, defaults to `false`                              |
 
-When `tools.less` is configured as `Object` type, it is merged with the default config through Object.assign in a shallow way. It should be noted that `lessOptions` is merged through deepMerge in a deep way. For example:
+### Modifying less-loader options
+
+When `lessLoaderOptions` is an `Object`, it is merged with the default config through Object.assign in a shallow way. It should be noted that `lessOptions` is merged through deepMerge in a deep way. For example:
 
 ```js
 export default {
   tools: {
     less: {
-      lessOptions: {
-        javascriptEnabled: false,
+      lessLoaderOptions: {
+        lessOptions: {
+          javascriptEnabled: false,
+        },
       },
     },
   },
 };
 ```
 
-### Function Type
+When `lessLoaderOptions` is a `Function`, the default config is passed as the first parameter, which can be directly modified or returned as the final result. The second parameter provides some utility functions that can be called directly. For example:
+
+```js
+export default {
+  tools: {
+    less: {
+      lessLoaderOptions(config) {
+        // Modify the config of lessOptions
+        config.lessOptions = {
+          javascriptEnabled: false,
+        };
+      },
+    },
+  },
+};
+```
 
-When `tools.less` is a Function, the default config is passed as the first parameter, which can be directly modified or returned as the final result. The second parameter provides some utility functions that can be called directly. For example:
+### Parallel compilation
+
+Less compilation is pure JavaScript and runs on the Node.js main thread by default. With `parallel` enabled, Less modules are compiled in a pool of worker threads, which shortens the build when a project has many Less files.
 
 ```js
 export default {
   tools: {
-    less(config) {
-      // Modify the config of lessOptions
-      config.lessOptions = {
-        javascriptEnabled: false,
-      };
+    less: {
+      parallel: true,
     },
   },
 };
 ```
 
+:::tip
+Options sent to worker threads must satisfy the [structured clone algorithm](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Structured_clone_algorithm). With `parallel` enabled, `lessLoaderOptions` therefore cannot contain functions, such as an `additionalData` function or a custom `implementation`.
+:::
+
 ### Modifying Less Version
 
 In some scenarios, if you need to use a specific version of Less instead of the built-in Less v4 in Modern.js, you can install the desired Less version in your project and set it up using the `implementation` option of the `less-loader`.
@@ -56,7 +87,9 @@ In some scenarios, if you need to use a specific version of Less instead of the
 export default {
   tools: {
     less: {
-      implementation: require('less'),
+      lessLoaderOptions: {
+        implementation: require('less'),
+      },
     },
   },
 };
@@ -73,8 +106,52 @@ Used to specify which files `less-loader` does not compile, You can pass in one
 ```js
 export default {
   tools: {
-    less(config, { addExcludes }) {
-      addExcludes(/node_modules/);
+    less: {
+      lessLoaderOptions(config, { addExcludes }) {
+        addExcludes(/node_modules/);
+      },
+    },
+  },
+};
+```
+
+The plugin's `exclude` option is the recommended equivalent:
+
+```js
+export default {
+  tools: {
+    less: {
+      exclude: /node_modules/,
+    },
+  },
+};
+```
+
+### Legacy form
+
+:::warning Do not mix the two layers
+As soon as an object contains a plugin-level key (`lessLoaderOptions`, `include`, `exclude`, ...), the whole object is parsed as plugin options and any loader option in it has no effect. For example, `lessOptions` in `tools.less: { parallel: true, lessOptions: { ... } }` is ignored and must be moved under `lessLoaderOptions`; a hint is printed in development.
+:::
+
+In earlier versions, `tools.less` took the less-loader options directly, e.g. `tools.less: { lessOptions: {} }` or `tools.less(config, { addExcludes }) {}`. This form still works: Modern.js wraps it into `lessLoaderOptions` and produces exactly the same config as before. A migration hint is printed in development, and the legacy form will be removed in the next major version.
+
+```js
+// legacy
+export default {
+  tools: {
+    less: {
+      lessOptions: { javascriptEnabled: false },
+    },
+  },
+};
+
+// current
+export default {
+  tools: {
+    less: {
+      lessLoaderOptions: {
+        lessOptions: { javascriptEnabled: false },
+      },
     },
   },
 };

package/docs/configure/app/tools/lightningcss-loader.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # tools.lightningcssLoader
 
 - **Type:** `Rspack.LightningcssLoaderOptions | Function | boolean`

package/docs/configure/app/tools/minify-css.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # tools.minifyCss
 
 - **Type:** `Object | Function | undefined`

package/docs/configure/app/tools/postcss.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # tools.postcss
 
 - **Type:** `Object | Function`

package/docs/configure/app/tools/rspack.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # tools.rspack
 
 - **Type:** `Rspack.Configuration | Function | undefined`

package/docs/configure/app/tools/sass.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # tools.sass
 
 - **Type:** `Object | Function`
@@ -5,41 +7,64 @@
 
 ```js
 const defaultOptions = {
-  // CSS Source Map enabled by default in development environment
-  sourceMap: isDev,
+  sassLoaderOptions: {
+    // CSS Source Map enabled by default in development environment
+    sourceMap: isDev,
+  },
 };
 ```
 
-You can modify the config of [sass-loader](https://github.com/webpack-contrib/sass-loader) via `tools.sass`.
+`tools.sass` modifies the options of [@rsbuild/plugin-sass](https://rsbuild.rs/plugins/list/plugin-sass). It accepts the full plugin options:
 
-### Object Type
+| Option              | Description                                                                                         |
+| ------------------- | --------------------------------------------------------------------------------------------------- |
+| `sassLoaderOptions` | Options passed to [sass-loader](https://github.com/webpack-contrib/sass-loader), object or function |
+| `include`           | Files handled by sass-loader, defaults to `/\.s(?:a\|c)ss$/`                                        |
+| `exclude`           | Files that sass-loader should skip                                                                  |
+| `rewriteUrls`       | Whether to rewrite relative URLs in Sass files with resolve-url-loader, defaults to `true`          |
 
-When `tools.sass` is `Object` type, it is merged with the default config through Object.assign. It should be noted that `sassOptions` is merged through deepMerge in a deep way.
+### Modifying sass-loader options
 
-For example:
+When `sassLoaderOptions` is an `Object`, it is merged with the default config through Object.assign in a shallow way. It should be noted that `sassOptions` is merged through deepMerge in a deep way. For example:
 
 ```js
 export default {
   tools: {
     sass: {
-      sourceMap: true,
+      sassLoaderOptions: {
+        sourceMap: true,
+      },
     },
   },
 };
 ```
 
-### Function Type
+When `sassLoaderOptions` is a `Function`, the default config is passed as the first parameter, which can be directly modified or returned as the final result. The second parameter provides some utility functions that can be called directly. For example:
+
+```js
+export default {
+  tools: {
+    sass: {
+      sassLoaderOptions(config) {
+        // Modify the additionalData config
+        config.additionalData = async (content, loaderContext) => {
+          // ...
+        };
+      },
+    },
+  },
+};
+```
 
-When `tools.sass` is a Function, the default config is passed as the first parameter, which can be directly modified or returned as the final result. The second parameter provides some utility functions that can be called directly. For Example:
+### Disabling URL rewriting
+
+By default, relative URLs in Sass files are rewritten by resolve-url-loader so that they resolve relative to the source file. If your project does not rely on this, turn it off to drop one loader from the chain:
 
 ```js
 export default {
   tools: {
-    sass(config) {
-      // Modify sourceMap config
-      config.additionalData = async (content, loaderContext) => {
-        // ...
-      };
+    sass: {
+      rewriteUrls: false,
     },
   },
 };
@@ -53,13 +78,15 @@ In some scenarios, if you need to use a specific version of Sass instead of the
 export default {
   tools: {
     sass: {
-      implementation: require('sass'),
+      sassLoaderOptions: {
+        implementation: require('sass'),
+      },
     },
   },
 };
 ```
 
-### Utility Function
+### Util Function
 
 #### addExcludes
 
@@ -70,8 +97,52 @@ Used to specify which files `sass-loader` does not compile, You can pass in one
 ```js
 export default {
   tools: {
-    sass(config, { addExcludes }) {
-      addExcludes(/node_modules/);
+    sass: {
+      sassLoaderOptions(config, { addExcludes }) {
+        addExcludes(/node_modules/);
+      },
+    },
+  },
+};
+```
+
+The plugin's `exclude` option is the recommended equivalent:
+
+```js
+export default {
+  tools: {
+    sass: {
+      exclude: /node_modules/,
+    },
+  },
+};
+```
+
+### Legacy form
+
+:::warning Do not mix the two layers
+As soon as an object contains a plugin-level key (`sassLoaderOptions`, `include`, `exclude`, ...), the whole object is parsed as plugin options and any loader option in it has no effect. For example, `sassOptions` in `tools.sass: { rewriteUrls: false, sassOptions: { ... } }` is ignored and must be moved under `sassLoaderOptions`; a hint is printed in development.
+:::
+
+In earlier versions, `tools.sass` took the sass-loader options directly, e.g. `tools.sass: { sassOptions: {} }` or `tools.sass(config, { addExcludes }) {}`. This form still works: Modern.js wraps it into `sassLoaderOptions` and produces exactly the same config as before. A migration hint is printed in development, and the legacy form will be removed in the next major version.
+
+```js
+// legacy
+export default {
+  tools: {
+    sass: {
+      sourceMap: true,
+    },
+  },
+};
+
+// current
+export default {
+  tools: {
+    sass: {
+      sassLoaderOptions: {
+        sourceMap: true,
+      },
     },
   },
 };

package/docs/configure/app/tools/style-loader.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # tools.styleLoader
 
 - **Type:** `Object | Function`

package/docs/configure/app/tools/svgr.md

@@ -0,0 +1,91 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
+# tools.svgr
+
+- **Type:** `Object | Function | false`
+- **Default:**
+
+```js
+const defaultOptions = {
+  mixedImport: true,
+  svgrOptions: {
+    exportType: 'named',
+  },
+};
+```
+
+`tools.svgr` modifies the options of [@rsbuild/plugin-svgr](https://rsbuild.rs/plugins/list/plugin-svgr). It accepts the full plugin options. Set it to `false` to skip registering the SVGR plugin; all `.svg` files are then treated as static assets.
+
+| Option            | Description                                                                                                |
+| ----------------- | ---------------------------------------------------------------------------------------------------------- |
+| `svgrOptions`     | Options passed to [SVGR](https://react-svgr.com/docs/options/), such as `exportType`, `icon`, `svgoConfig` |
+| `parallel`        | Whether to transform SVG files in worker threads, defaults to `false`                                      |
+| `exclude`         | SVG files that SVGR should skip                                                                            |
+| `excludeImporter` | Importer files whose SVG imports should skip SVGR                                                          |
+| `query`           | Query that triggers the SVGR transform, defaults to `/react/`                                              |
+| `mixedImport`     | Whether a module may import both the URL and the React component, defaults to `true`                       |
+
+### Merge rules
+
+When `tools.svgr` is an `Object`, its top-level fields are merged with the defaults through Object.assign in a shallow way, and `svgrOptions` is merged one level deeper, so setting only `svgrOptions.icon` keeps the default `exportType`.
+
+When `tools.svgr` is a `Function`, the default config is passed as the first parameter, which can be directly modified or returned as the final result. An array of objects and functions is also accepted and applied in order.
+
+### Parallel transform
+
+The SVGR transform is pure JavaScript and runs on the Node.js main thread by default. With many SVG files, enable `parallel` to move the transform into a pool of worker threads:
+
+```js
+export default {
+  tools: {
+    svgr: {
+      parallel: true,
+    },
+  },
+};
+```
+
+:::tip
+Options sent to worker threads must satisfy the [structured clone algorithm](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Structured_clone_algorithm). With `parallel` enabled, `svgrOptions` therefore cannot contain functions.
+:::
+
+### Changing the default export
+
+`svgrOptions.exportType` controls what an SVG file exports by default: `'named'` exports the file URL by default and the React component as the named export `ReactComponent`; `'default'` exports the React component by default.
+
+```js
+export default {
+  tools: {
+    svgr: {
+      svgrOptions: {
+        exportType: 'default',
+      },
+    },
+  },
+};
+```
+
+### Disabling SVGR
+
+If you are sure that no SVG asset in your project is used as a React component, disable SVGR to improve build performance:
+
+```js
+export default {
+  tools: {
+    svgr: false,
+  },
+};
+```
+
+### Relation to the legacy options
+
+`tools.svgr` replaces the two deprecated options below. They still work today and will be removed in the next major version:
+
+| Legacy option                          | Replacement                                              |
+| -------------------------------------- | -------------------------------------------------------- |
+| `output.svgDefaultExport: 'component'` | `tools.svgr: { svgrOptions: { exportType: 'default' } }` |
+| `output.svgDefaultExport: 'url'`       | `tools.svgr: { svgrOptions: { exportType: 'named' } }`   |
+| `output.disableSvgr: true`             | `tools.svgr: false`                                      |
+| `output.disableSvgr: false`            | Default behavior, just remove it                         |
+
+When both are set, `tools.svgr` wins: once `tools.svgr` is set explicitly, `output.disableSvgr` no longer applies, and `tools.svgr.svgrOptions.exportType` overrides the value derived from `output.svgDefaultExport`.

package/docs/configure/app/tools/swc.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # tools.swc
 
 - **Type:** `Object | Function`

package/docs/configure/app/tools/ts-checker.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # tools.tsChecker
 
 - **Type:** `Object | Function`

package/docs/configure/app/usage.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # Configuration
 
 There are three types of configurations in Modern.js: Compile configuration, Runtime configuration, and Server Runtime configuration.
@@ -265,11 +267,7 @@ import { defineConfig } from '@modern-js/app-tools';
 import { xxPlugin } from '@modern-js/plugin-xx';
 
 export default defineConfig({
-  plugins: [
-    xxPlugin({
-      /** Add parameters here */
-    }),
-  ],
+  plugins: [xxPlugin({/** Add parameters here */})],
 });
 ```
 

package/docs/guides/advanced-features/bff/cross-project.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # Cross-Project Invocation
 
 Based on the BFF architecture, Modern.js provides cross-project invocation capabilities, allowing BFF functions created in one project to be invoked by other projects through integrated calls, enabling function sharing and feature reuse across projects.
@@ -23,7 +25,7 @@ Ensure the current project has BFF enabled with API files defined under `api/lam
 export default defineConfig({
   bff: {
     crossProject: true,
-  }
+  },
 });
 ```
 
@@ -87,9 +89,9 @@ import { configure as innerConfigure } from '@modern-js/plugin-bff/client';
 import axios from 'axios';
 
 configure({
-    setDomain() {
-        return 'https://your-bff-api.com';
-    },
+  setDomain() {
+    return 'https://your-bff-api.com';
+  },
 });
 
 innerConfigure({

package/docs/guides/advanced-features/bff/extend-server.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # Extend BFF Server
 
 In some applications, developers may want to handle all BFF functions uniformly, such as authentication, logging, data processing, etc.

package/docs/guides/advanced-features/bff/frameworks.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # Runtime Framework
 
 Modern.js uses [Hono.js](https://hono.dev/) as the BFF and Server runtime framework, so you can [extend BFF Server](/guides/advanced-features/bff/extend-server.md) based on the Hono.js ecosystem.

package/docs/guides/advanced-features/bff/function.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # Basic Usage
 
 In a Modern.js application, developers can define API files under the `api/lambda` directory and export API functions from these files. In the frontend code, these API functions can be directly invoked by importing the file, which initiates the API requests.

package/docs/guides/advanced-features/bff/operators.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # Creating Extensible BFF Functions
 
 The previous section showed how to export a simple BFF function in a file. In more complex scenarios, each BFF function may need to do independent type validation, pre-logic, etc.

package/docs/guides/advanced-features/bff/sdk.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # Extend Request SDK
 
 The unified invocation of BFF functions is isomorphic in both CSR and SSR. The request SDK encapsulated by Modern.js relies on the [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch) on the browser side, and on [node-fetch](https://www.npmjs.com/package/node-fetch) on the server side. However, in actual business scenarios, additional processing may be required for requests or responses, such as:

package/docs/guides/advanced-features/bff/upload.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # File Upload
 
 BFF combined with runtime framework provides file upload capabilities, supporting integrated calls and pure function manual calls.

package/docs/guides/advanced-features/bff.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # BFF
 
 BFF (Backends for Frontends) is an architectural pattern primarily used to address issues of data aggregation in front-end and back-end collaboration. Under the BFF architecture, front-end applications do not communicate directly with backend services. Instead, they interact with backend services through a dedicated BFF middleware layer, custom-made for the front end.

package/docs/guides/advanced-features/build-performance.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # Improve Build Performance
 
 Modern.js optimizes build performance by default, but as the project becomes larger, you may encounter some build performance problems.

package/docs/guides/advanced-features/compatibility.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # Browser Compatibility
 
 ## Browserslist Configuration

package/docs/guides/advanced-features/international/advanced.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # Advanced Usage
 
 ## SSR Scenarios
@@ -64,7 +66,7 @@ i18nPlugin({
     localeDetectionByEntry: {
       admin: {
         localePathRedirect: false, // admin does not use path prefixes
-        languages: ['en'],         // admin only supports English
+        languages: ['en'], // admin only supports English
       },
       mobile: {
         languages: ['zh', 'en', 'ja'], // mobile supports more languages

package/docs/guides/advanced-features/international/api.md

@@ -1,3 +1,5 @@
+> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.
+
 # API Reference
 
 ## useModernI18n
@@ -162,11 +164,11 @@ Type of the custom backend loader function:
 type I18nSdkLoader = (options: I18nSdkLoadOptions) => Promise<Resources>;
 
 interface I18nSdkLoadOptions {
-  lng?: string;      // Single language code
-  ns?: string;       // Single namespace
-  lngs?: string[];   // Multiple language codes
-  nss?: string[];    // Multiple namespaces
-  all?: boolean;     // Load all resources
+  lng?: string; // Single language code
+  ns?: string; // Single namespace
+  lngs?: string[]; // Multiple language codes
+  nss?: string[]; // Multiple namespaces
+  all?: boolean; // Load all resources
 }
 
 type Resources = {
@@ -181,14 +183,14 @@ type Resources = {
 ```ts
 interface LanguageDetectorOptions {
   order?: string[];
-  lookupQuerystring?: string;   // Default: 'lng'
-  lookupCookie?: string;        // Default: 'i18next'
-  lookupLocalStorage?: string;  // Default: 'i18nextLng'
+  lookupQuerystring?: string; // Default: 'lng'
+  lookupCookie?: string; // Default: 'i18next'
+  lookupLocalStorage?: string; // Default: 'i18nextLng'
   lookupSession?: string;
-  lookupHeader?: string;        // Default: 'accept-language'
+  lookupHeader?: string; // Default: 'accept-language'
   lookupFromPathIndex?: number; // Default: 0
   caches?: false | string[];
-  cookieMinutes?: number;       // Default: 525600 (1 year)
+  cookieMinutes?: number; // Default: 525600 (1 year)
   cookieExpirationDate?: Date;
   cookieDomain?: string;
 }
@@ -208,8 +210,8 @@ import { useTranslation } from 'react-i18next';
 import { useModernI18n } from '@modern-js/plugin-i18n/runtime';
 
 function App() {
-  const { t } = useTranslation();                          // Translate text
-  const { language, changeLanguage } = useModernI18n();    // Switch language
+  const { t } = useTranslation(); // Translate text
+  const { language, changeLanguage } = useModernI18n(); // Switch language
 
   return (
     <div>
@@ -227,5 +229,11 @@ You can also get the i18next instance from `useModernI18n` and call capabilities
 const { i18nInstance } = useModernI18n();
 
 // Dynamically add translation resources.
-i18nInstance.addResourceBundle('zh', 'translation', { key: 'Value' }, true, true);
+i18nInstance.addResourceBundle(
+  'zh',
+  'translation',
+  { key: 'Value' },
+  true,
+  true,
+);
 ```