Skip to content

Commit e6294f7

Browse files
authored
docs(plugins): add source map introduction for transform hook (#6052)
1 parent ccaf29e commit e6294f7

File tree

2 files changed

+28
-0
lines changed

2 files changed

+28
-0
lines changed

website/docs/en/plugins/dev/core.mdx

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -511,6 +511,20 @@ In Rsbuild plugins, you can quickly implement code transformation functions usin
511511

512512
Note that for some complex code transformation scenarios, `api.transform` may not be sufficient. In such situations, you can implement it using the Rspack loader.
513513

514+
### Source maps
515+
516+
You can return a source map in the `transform` function, and Rsbuild will automatically merge the returned source map with source maps generated by other Rspack loaders or `transform` hooks, ensuring that the final source map correctly maps back to the original source code.
517+
518+
```js
519+
api.transform({ test: /\.js$/ }, async ({ code }) => {
520+
const { transformedCode, sourceMap } = await someTransformFunction(code);
521+
return {
522+
code: transformedCode,
523+
map: sourceMap,
524+
};
525+
});
526+
```
527+
514528
## api.resolve
515529

516530
Intercept and modify module request information before module resolution begins. The same as Rspack's [normalModuleFactory.hooks.resolve](https://rspack.rs/api/plugin-api/normal-module-factory-hooks#resolve) hook.

website/docs/zh/plugins/dev/core.mdx

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -511,6 +511,20 @@ api.transform(
511511

512512
注意,对于一些复杂的代码转换场景,`api.transform` 可能无法满足,此时你可以使用 Rspack loader 进行实现。
513513

514+
### Source maps
515+
516+
你可以在 `transform` 函数中返回一个 source map,Rsbuild 会自动将返回的 source map 与其他 Rspack loader 或 `transform` hook 生成的 source maps 合并,使最终的 source map 能够正确映射到原始源代码。
517+
518+
```js
519+
api.transform({ test: /\.js$/ }, async ({ code }) => {
520+
const { transformedCode, sourceMap } = await someTransformFunction(code);
521+
return {
522+
code: transformedCode,
523+
map: sourceMap,
524+
};
525+
});
526+
```
527+
514528
## api.resolve
515529

516530
在模块解析开始之前,拦截并修改模块的请求信息。等价于 Rspack 的 [normalModuleFactory.hooks.resolve](https://rspack.rs/zh/api/plugin-api/normal-module-factory-hooks#resolve) hook。

0 commit comments

Comments
 (0)