![](https://img-blog.csdnimg.cn/20190927151117521.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
Storybook
文章平均质量分 87
介绍 Storybook 的使用
存梨
不负好时光
展开
-
问题记录:使用 @svgr/webpack 配置 svg 文件引入
之前项目是使用的 Babel 来配置 svg 的引入,升级后希望体验 nextjs 的 swc编译速度。先来声明项目架构,基于 next.js 和 react 搭建的项目,均采用最新的版本。由于 nextjs 对于 svg 的引入方式有自己的一套规则,在配置文件中需要找到这些规则并覆盖。这个字段在官方文档中藏的还蛮深的,在 options 里翻了一遍没有找到,去使用实例中才看出来端倪。还支持另一个值 ‘named‘,这个参数值则能获得期望的行为,导出的 svg 文件如下。那么需要修改配置,及类型声明。原创 2024-03-05 19:27:44 · 1334 阅读 · 0 评论 -
【总结】storybook 6.4.22 升级到 7.x 都经历了什么
在 6.x 中使用的是 csf2 的写法,升级到 7.x 需要使用 csf 3.0 的写法。如果项目使用了 babel,在.storybook 中必须包含 babel 的配置文件,否则项目的 babel 配置在 storybook 运行时不会生效。在发布到测试环境时,我使用的是 vercel 来构建,就需要去 vercel 的 settings 中去修改 node 的版本,如下图所示。无法自动迁移的 story 需要手动修改,这个过程是比较痛苦的,重复性的机械劳动。同时,官方文档给出的解决方案是添加。原创 2023-07-07 15:35:33 · 348 阅读 · 0 评论