描述bug
在使用带有"suspense decorator"的v6 storybook store时,我在story中收到了这个错误:
TypeError: can't convert symbol to string
Dv index.js:497
io index.js:659
y5 index.js:670
nu index.js:709
g6 config.mjs:19
React 3
g6 config.mjs:19
jv config.mjs:20
hookified runtime.js:7
decorateStory runtime.js:34
bindWithContext runtime.js:34
wrapper chunk-DXNAW7Q2.mjs:7
decorator runtime.js:104
makeDecorator runtime.js:104
hookified runtime.js:7
decorateStory runtime.js:34
bindWithContext runtime.js:34
AB preview.mjs:19
hookified runtime.js:7
decorateStory runtime.js:34
bindWithContext runtime.js:34
EB preview.mjs:9
hookified runtime.js:7
decorateStory runtime.js:34
bindWithContext runtime.js:34
KB preview.mjs:6
hookified runtime.js:7
decorateStory runtime.js:34
bindWithContext runtime.js:34
i8 preview.mjs:401
hookified runtime.js:7
decorateStory runtime.js:34
defaultDecorateStory runtime.js:34
applyHooks runtime.js:7
unboundStoryFn runtime.js:34
React 7
g scheduler.production.min.js:13
Y scheduler.production.min.js:14
EventHandlerNonNull* scheduler.production.min.js:14
<anonymous> scheduler.production.min.js:19
react-dom.production.min.js:189:29
我终于将其缩小到使用v6的storybook store。
重现问题
https://stackblitz.com/edit/github-xgijrv-d6etea?file=.storybook%2Fmain.ts
系统环境
normally on macOS, but my repro works in stackblitz:
❯ npx storybook info
Environment Info:
System:
OS: Linux 5.0 undefined
CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
Binaries:
Node: 16.20.0 - /usr/local/bin/node
Yarn: 1.22.19 - /usr/local/bin/yarn
npm: 9.4.2 - /usr/local/bin/npm
npmPackages:
@storybook/addon-essentials: ^7.1.0-alpha.38 => 7.1.0-alpha.38
@storybook/addon-interactions: ^7.1.0-alpha.38 => 7.1.0-alpha.38
@storybook/addon-links: ^7.1.0-alpha.38 => 7.1.0-alpha.38
@storybook/blocks: ^7.1.0-alpha.38 => 7.1.0-alpha.38
@storybook/react: ^7.1.0-alpha.38 => 7.1.0-alpha.38
@storybook/react-vite: ^7.1.0-alpha.38 => 7.1.0-alpha.38
@storybook/testing-library: ^0.2.0 => 0.2.0
附加背景信息
我们仍然使用v6 storybook store的唯一原因是我认为Chromatic在某个时候还没有支持v7?我想知道他们是否更新了他们的支持...
看起来是的:
- 除了现在我遇到了Vite的异步CSS导入问题,所以我在努力解决
optimizeDeps
,以确保我的基本样式不会覆盖特定组件的样式。. ( vitejs/vite#3924 )
7条答案
按热度按时间piztneat1#
另一个有趣的React 18特性,例如#18258。
jvlzgdj92#
非常感谢你的汇报。鉴于它是遗留模式,并且产品的其他部分存在许多紧迫的问题,我不认为我们会优先考虑故事商店v6。但是也许有一个简单的解决方法(@tmeasday?)。我强烈建议你尽可能升级到SSv7,对于
storiesOf
用户,我们正在积极调查前进的道路:#23177lnvxswe23#
遗憾的是,由于vitejs/vite#3924,我不认为我们可以从SSv6过渡过来,因为生产环境中的Vite构建中的异步CSS导入是错误的(顺序混乱)。
否则我很高兴升级💜
0vvn1miw4#
@jasikpark,你明白我们在v6模式下所做的操作导致了这个问题吗?
我认为我们仍然使用storybook store v6的唯一原因是Chromatic在某个时候没有支持v7。我想知道他们是否更新了他们的支持...
Chromatic确实支持v7,不用担心!
可惜的是,由于vitejs/vite#3924,我相信我们无法从SSv6过渡,因为生产Vite构建中的异步CSS导入是错误的(顺序混乱)。
@IanVS,我们是否为v7添加了急切加载功能来解决这个bug?我不记得了,我们最终是否发货了?
lsmd5eda5#
我将暂时探索如何不触发这个问题,也许可以通过不在我们的React查询使用中使用悬念来实现。你有关于急切加载的讨论链接吗?
尝试将Vite设置为捆绑单个捆绑包,但似乎不起作用。
jslywgbw6#
我们是否在v7中添加了急切加载功能来解决这个bug?我不记得了,我们最终是否发布了它?
实际上,我和@IanVS一起在同一个故事书应用程序上工作——如果你们做了,我们从未尝试更新以尝试使用它。
a1o7rhls7#
不,我没有添加这个功能,它感觉很边缘化,所以我暂时让我们在v6商店上进行生产。我认为我们(Caleb和我)可能需要在某个时候放弃css模块以避免vite问题,因为我不认为它会被解决。