@@ -151,7 +151,7 @@ export default defineConfig({
151151
152152Rslib 支持使用 Storybook 开发 Module Federation Rslib 项目。
153153
154- #### 1. 启动库的 MF ` dev `
154+ #### 1. 启动库的 MF ` dev `
155155
156156添加 ` dev ` 命令在 ` package.json ` 文件:
157157
@@ -179,52 +179,52 @@ Rslib 支持使用 Storybook 开发 Module Federation Rslib 项目。
179179
180180 <PackageManagerTabs command = " add storybook-addon-rslib @module-federation/storybook-addon -D" />
181181
182- 2 . 然后创建 Storybook 配置文件 ` .storybook/main.ts ` ,指定 stories 和 addons,并设置 framework 和相应的 framework 集成。
182+ 2 . 然后创建 Storybook 配置文件 ` .storybook/main.ts ` ,指定 stories 和 addons,并设置 framework 和相应的 framework 集成。
183183
184184``` ts title=".storybook/main.ts" {18-38}
185- import { dirname , join } from ' node:path' ;
186- import type { StorybookConfig } from ' storybook-react-rsbuild' ;
187-
188- function getAbsolutePath(value : string ): any {
189- return dirname (require .resolve (join (value , ' package.json' )));
190- }
191-
192- const config: StorybookConfig = {
193- stories: [
194- ' ../stories/**/*.mdx' ,
195- ' ../stories/**/*.stories.@(js|jsx|mjs|ts|tsx)' ,
196- ],
197- framework: {
198- name: getAbsolutePath (' storybook-react-rsbuild' ),
199- options: {},
200- },
201- addons: [
202- {
203- name: getAbsolutePath (' storybook-addon-rslib' ),
204- options: {
205- rslib: {
206- include: [' **/stories/**' ],
207- },
208- },
209- },
210- {
211- name: ' @module-federation/storybook-addon/preset' ,
212- options: {
213- // 在添加 rslib module manifest 给 storybook dev
214- // 我们在上面已经设置了 dev.assetPrefix 和 server.port 到 3001 在 rslib.config.ts
215- remotes: {
216- ' rslib-module' :
217- // 还可以在这里添加 storybook 的 shared
218- // shared: {}
219- ' rslib-module@http://localhost:3001/mf/mf-manifest.json' ,
220- },
221- },
222- },
223- ],
224- };
225-
226- export default config ;
227- ```
185+ import { dirname , join } from ' node:path' ;
186+ import type { StorybookConfig } from ' storybook-react-rsbuild' ;
187+
188+ function getAbsolutePath(value : string ): any {
189+ return dirname (require .resolve (join (value , ' package.json' )));
190+ }
191+
192+ const config: StorybookConfig = {
193+ stories: [
194+ ' ../stories/**/*.mdx' ,
195+ ' ../stories/**/*.stories.@(js|jsx|mjs|ts|tsx)' ,
196+ ],
197+ framework: {
198+ name: getAbsolutePath (' storybook-react-rsbuild' ),
199+ options: {},
200+ },
201+ addons: [
202+ {
203+ name: getAbsolutePath (' storybook-addon-rslib' ),
204+ options: {
205+ rslib: {
206+ include: [' **/stories/**' ],
207+ },
208+ },
209+ },
210+ {
211+ name: ' @module-federation/storybook-addon/preset' ,
212+ options: {
213+ // 在添加 rslib module manifest 给 storybook dev
214+ // 我们在上面已经设置了 dev.assetPrefix 和 server.port 到 3001 在 rslib.config.ts
215+ remotes: {
216+ ' rslib-module' :
217+ // 还可以在这里添加 storybook 的 shared
218+ // shared: {}
219+ ' rslib-module@http://localhost:3001/mf/mf-manifest.json' ,
220+ },
221+ },
222+ },
223+ ],
224+ };
225+
226+ export default config ;
227+ ```
228228
229229#### 3. 用远程模块 编写 stories
230230
0 commit comments