storybook [Bug]: 使用Houdini时,Svelte HMR中断

vh0rcniy  于 6个月前  发布在  其他
关注(0)|答案(6)|浏览(58)

描述bug

如果我使用 https://houdinigraphql.com/,它涉及到在vite.config.ts中设置一个houdini()插件。如果启用了这个插件,HMR就无法工作。所以目前我通过这种方式避免它。

import { sveltekit } from '@sveltejs/kit/vite';
import houdini from 'houdini/vite';
import { defineConfig } from 'vite';
import { sentrySvelteKit } from '@sentry/sveltekit';

export default () => {
    return defineConfig({
        plugins: [
            ...[process.env['npm_lifecycle_event'] !== 'storybook' ? houdini() : []],
            sentrySvelteKit({
                sourceMapsUploadOptions: {
                    org: 'spur-ma',
                    project: 'spur-website',
                },
                autoUploadSourceMaps: true,
                adapter: 'vercel',
            }),
            sveltekit(),
        ],
    });
};

重现问题

以下是问题的最小复现示例:
https://github.com/rohanrajpal/houdini-storybook-hmr-bug-repro
同时,我还在与houdini的创建者进行对话:
https://discord.com/channels/1024421016405016718/1152214264547905556
他的初始回复
我认为这与schema池化无关。你可以在你的houdini.config.js中注解掉watchSchema来检查。
话虽如此,我不知道这可能是什么问题><
我没有使用storybook,所以我不确定如何提供帮助。
你的storybook中有一些graphql吗?
你知道它们是否像Sentry、SvelteKit、Houdini那样转换文件吗?
我在watchSchema上添加了注解并确认它与轮询无关,这是我的错。

系统信息

Environment Info:

  System:
    OS: macOS 13.5.2
    CPU: (8) arm64 Apple M1 Pro
  Binaries:
    Node: 18.12.1 - ~/.local/share/nvm/v18.12.1/bin/node
    Yarn: 1.22.19 - ~/.yarn/bin/yarn
    npm: 8.19.2 - ~/.local/share/nvm/v18.12.1/bin/npm
  Browsers:
    Chrome: 116.0.5845.187
    Safari: 16.6
  npmPackages:
    @storybook/addon-essentials: ^7.4.2 => 7.4.2 
    @storybook/addon-interactions: ^7.4.2 => 7.4.2 
    @storybook/addon-links: ^7.4.2 => 7.4.2 
    @storybook/addon-styling: ^1.3.7 => 1.3.7 
    @storybook/blocks: ^7.4.2 => 7.4.2 
    @storybook/jest: ^0.2.2 => 0.2.2 
    @storybook/svelte: ^7.4.2 => 7.4.2 
    @storybook/sveltekit: ^7.4.2 => 7.4.2 
    @storybook/test-runner: ^0.13.0 => 0.13.0 
    @storybook/testing-library: ^0.2.1 => 0.2.1

附加上下文

  • 无响应*
woobm2wo

woobm2wo1#

@JReinhold 有任何建议吗?

im9ewurl

im9ewurl2#

我不知道为什么会这样。我查看了Houdini的源代码,但没有找到任何有意义的东西。
@IanVS 我们在Vite中使用HMR时是否做了一些特殊的事情,可能会被某些Vite插件禁用,或者类似的事情?

vyswwuz2

vyswwuz23#

@AlecAivazis@jycouet 你对这个问题有什么看法吗?

ut6juiuv

ut6juiuv4#

我们唯一能做的就是从故事本身中去除HMR边界:code/builders/builder-vite/src/plugins/strip-story-hmr-boundaries.ts。在Vite的最近版本中,我们可以移除这个插件,因为底层的bug已经修复了,但在这种情况下,应该没有HMR边界,所以插件没有任何效果。

我另一个猜测是Houdini依赖于文件系统以某种特定方式组织,而Storybook创建了一个虚拟入口点文件并在预览中提供该文件。但这只是一个相当不成熟的猜测。

rlcwz9us

rlcwz9us5#

对不起,这里回复有点慢!

在houdini仓库里有一个类似的问题,我打算尽快解决(HoudiniGraphql/houdini#1116)。如果我遇到任何问题或需要任何指导,我会在这里报告。我们需要做一些hacky的事情来弯曲sveltekit的路由器以实现我们想要的功能,这可能是导致一些问题的原因。如果我们现在只是把这个问题称为houdini问题,我不会介意😅

mv1qrgav

mv1qrgav6#

抱歉在这里的回复有些滞后!
在houdini仓库中有一个类似的问题,我很快就会尝试解决它(HoudiniGraphql/houdini#1116)。如果我遇到任何问题或需要任何指导,我会在这里报告。我们需要做一些hacky的事情来弯曲sveltekit的路由器以实现我们想要的功能,这可能是导致一些问题的原因。如果我们现在只是称之为houdini问题,我不会介意的😅
哎呀,真的很抱歉没有搜索houdini的问题仓库!我只是查看了discord频道,以为这个问题没有被报告,真是我的错。

相关问题