Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Storybook 6.3 + Vite support? #166

Open
adiun opened this issue Jul 4, 2021 · 5 comments
Open

Storybook 6.3 + Vite support? #166

adiun opened this issue Jul 4, 2021 · 5 comments

Comments

@adiun
Copy link

adiun commented Jul 4, 2021

Storybook 6.3 introduced Vite support. Vite replaces webpack for us in our toolchain, greatly improves build speed, and works great with Storybook as of 6.3.

We've been running creevey for some time on local machines and in CI, it works well for us. When I try to run creevey with this new Vite setup I get this error:

[CreeveyWebpack]: Starting with pid 46200
[FAIL:46200] TypeError: builder.overridePresets is not iterable
    at getWebpackConfigForStorybook_6_2 (/Users/adi/Documents/Projects/Terminal2/node_modules/creevey/lib/server/webpack/index.js:180:94)
    at processTicksAndRejections (internal/process/task_queues.js:93:5)
    at async Object.compile [as default] (/Users/adi/Documents/Projects/Terminal2/node_modules/creevey/lib/server/webpack/index.js:247:34)

I could be wrong but from these errors I'm getting it looks like creevey depends on the webpack configuration in Storybook. Will or does creevey support the new Vite features for Storybook?

@wKich
Copy link
Collaborator

wKich commented Jul 5, 2021

@adiun Hi, thanks for the issue. I made a feature for loading stories without webpack, but didn't test it with Vite. I have a flag useWebpackToExtractTests in config which rules how to load stories. If you are using Storybook 6.3 and even 6.2 it should work well and Creevey shouldn't load webpack. It looks like a bug.

The flag is false by default for Storybook >= 6.2 and true for older versions. It's set here https://github.com/wKich/creevey/blob/ae3c6b712a8e41a7d3f4396b269d471c578d9408/src/server/config.ts#L54

@wKich
Copy link
Collaborator

wKich commented Jul 5, 2021

I'm using webpack only to compile Creevey client UI bundle for npm package, that's why it listed in devDeps

@wKich
Copy link
Collaborator

wKich commented Jul 12, 2021

@adiun, Hi. I didn't see that error while fixing creevey to work with Vite. But I checked, that Creevey works in your monorepo project with vite and also it works on a fresh clean vite project.

I released 0.7.33 with those fixes. Please, check it out. And feel free to ask me if something goes wrong.

@adiun
Copy link
Author

adiun commented Jul 12, 2021

Thank you @wKich! I will check it out. The issue I'm running into is that I'm trying to run creevey --extract to create a stories.json for my storybook project (which I am using to publish the storybook) which hits this error. Have you tried that with Vite? I will give it a shot later today as well.

@wKich
Copy link
Collaborator

wKich commented Jul 12, 2021

@adiun no I didn't. But I'm pretty sure if creevey starts tests without any errors, the extract will work as well, because it reuse same logic to get stories meta.

The one important issue that I found is Creevey doesn't work well with monorepos, I mean that Creevey work with only one storybook config at the time. So you need to have root storybook setup and the same for Creevey, or have to use Creevey per each package inside a monorepo like here adiun/vite-monorepo#1

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants