Skip to content

Commit 4dad17b

Browse files
committed
chore: update
1 parent 807960f commit 4dad17b

File tree

2 files changed

+4
-4
lines changed

2 files changed

+4
-4
lines changed

website/docs/en/guide/solution/index.mdx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,9 @@ In this chapter, we will introduce how to use Rslib to development libraries for
66

77
When developing a library that runs in the browser, you can package it in both [ESM](/guide/basic/output-format#esm--cjs) and [CJS](/guide/basic/output-format#esm--cjs) formats for integration with application bundlers. Configuring the package [conditional exports](https://nodejs.org/api/packages.html#conditional-exports) to ESM output allows for better tree shaking. Additionally, you can create [UMD](/guide/basic/output-format#umd) format output for direct browser use and even generate [Module Federation ](/guide/advanced/module-federation) formats for dynamic loading by other applications. Configure [Browserslist](https://rsbuild.dev/guide/advanced/browserslist) according to the target browser support to determine the downgrade syntax of the output, or add a [polyfill](/guide/advanced/output-compatibility) for API compatibility.
88

9-
When publishing to npm, you can choose not to [minify](/config/rsbuild/output#outputminify) your code or to minify it while providing a [sourcemap](/config/rsbuild/output#outputsourcemap) to enhance the debugging experience for users of your library. For styling, you can use [CSS](/guide/advanced/css), or [CSS pre-processors](/guide/advanced/css#preprocessors) like Sass, Less, or Stylus, or apply [PostCSS](/guide/advanced/css#postcss) for CSS post-processing. Tools like [Tailwind CSS](/guide/advanced/css#tailwind-css) can also help in building your styles. Using [CSS modules](/guide/advanced/css#css-modules) to create CSS modules is another option.
9+
When publishing to npm, you can choose not to [minify](/config/rsbuild/output#outputminify) your code or to minify it while providing a [sourcemap](/config/rsbuild/output#outputsourcemap) to enhance the debugging experience for users of your library. For styling, you can use CSS, or CSS pre-processors like Sass, Less, or Stylus, or apply PostCSS for CSS post-processing. Tools like Tailwind CSS can also help in building your styles. Using CSS Modules to create CSS modules is another option.
1010

11-
In terms of resource management, Rslib handles [static assets](/guide/advanced/assets) used in your code, such as SVG and PNG files. You can also build a component library of [React](/guide/solution/react), [Preact](https://github.com/web-infra-dev/rslib/tree/main/examples/preact-component-bundle-false), or other frameworks, and use [Storybook](/guide/advanced/storybook) for UI component development and testing.
11+
In terms of resource management, Rslib handles static assets used in your code, such as SVG and PNG files. You can also build a component library of [React](/guide/solution/react), [Preact](https://github.com/web-infra-dev/rslib/tree/main/examples/preact-component-bundle-false), or other frameworks, and use [Storybook](/guide/advanced/storybook) for UI component development and testing.
1212

1313
Refer to the solutions in this chapter to learn how to use Rslib to develop browser libraries for different frameworks.
1414

website/docs/zh/guide/solution/index.mdx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,9 @@
66

77
开发在浏览器中运行的库时,可以将其打包为 [ESM](/guide/basic/output-format#esm--cjs)[CJS](/guide/basic/output-format#esm--cjs) 格式,用于与 app 的 bundler 集成。将包 [conditional-exports](https://nodejs.org/api/packages.html#conditional-exports) 配置为 ESM 输出可以更好地进行 treeshaking。此外,你可以创建 [UMD](/guide/basic/output-format#umd) 格式输出以供浏览器直接使用,甚至可以生成 [模块联邦](/guide/advanced/module-federation) 格式以供其他应用程序动态加载。根据目标浏览器支持配置 [Browserslist](https://rsbuild.dev/zh/guide/advanced/browserslist)以确定输出的降级语法,或添加 [polyfill](/guide/advanced/output-compatibility) 用于兼容 API。
88

9-
发布到 npm 时,你可以选择不压缩代码或[压缩代码](/config/rsbuild/output#outputminify),同时提供[sourcemap](/config/rsbuild/output#outputsourcema) 以增强库使用者的调试体验。样式上,可以使用 [CSS](/guide/advanced/css)[CSS 预处理器](/guide/advanced/css#preprocessors),如 Sass、Less 或 Stylus 等,或使用 [PostCSS](/guide/advanced/css#postcss) 用于 CSS 后处理。 [Tailwind CSS](/guide/advanced/css#tailwind-css) 等工具也可以帮助你构建样式。或使用 [CSS Modules](/guide/advanced/css#css-modules)
9+
发布到 npm 时,你可以选择不压缩代码或[压缩代码](/config/rsbuild/output#outputminify),同时提供[sourcemap](/config/rsbuild/output#outputsourcema) 以增强库使用者的调试体验。样式上,可以使用 CSS 或 CSS 预处理器,如 Sass、Less 或 Stylus 等,或使用 PostCSS 用于 CSS 后处理。 Tailwind CSS 等工具也可以帮助你构建样式,也可以使用 CSS Modules。
1010

11-
在资源处理方面,Rslib 处理代码中使用的[静态资源](/guide/advanced/assets),例如 SVG 和 PNG 文件。你还可以构建[React](/guide/solution/react)[Preact](https://github.com/web-infra-dev/rslib/tree/main/examples/preact-component-bundle-false) 或其他框架,使用 [Storybook](/guide/advanced/storybook) 进行 UI 组件开发和测试。
11+
在资源处理方面,Rslib 处理代码中使用的静态资源,例如 SVG 和 PNG 文件。你还可以构建[React](/guide/solution/react)[Preact](https://github.com/web-infra-dev/rslib/tree/main/examples/preact-component-bundle-false) 或其他框架,使用 [Storybook](/guide/advanced/storybook) 进行 UI 组件开发和测试。
1212

1313
参考本章的解决方案,了解如何使用 Rslib 开发一个在浏览器中使用的库,给多种框架使用。
1414

0 commit comments

Comments
 (0)