Handle new versions of vite-plugin-svelte #382
Merged
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Fixes #381
There have been two changes in @sveltejs/vite-plugin-svelte that cause problems for us, which this PR addresses:
https://github.com/sveltejs/vite-plugin-svelte/releases/tag/%40sveltejs%2Fvite-plugin-svelte%401.0.0-next.42 started to merge the
svelte.config.js
file by default, which may not be what storybook users want / expect, since their production config may be different from the storybook config (same reason we don't automatically mergevite.config.js
). With the changes here, theconfigFile
option insvelteOptions
can still be set totrue
or to a specific file, if desired.https://github.com/sveltejs/vite-plugin-svelte/releases/tag/%40sveltejs%2Fvite-plugin-svelte%401.0.0-next.43 began returning an array of plugins rather than just a single one. This would normally be fine, except that we hack around with the plugin to create two separate ones, with different names, to avoid HMR in story files. So, this PR checks to see if the result is an array or not, and reacts accordingly. Note, I'm throwing away the inspector for story files. This might be a problem, but until we hear about it, I think this'll be fine. The inspector is still pretty experimental anyway, from what I can tell.
To test, you can revert the changes I've made in
vite-config.ts
, and you'll see that thesvelte
example breaks (I updated the svelte plugin in it). With the changes, it builds successfully.This also enables the use of the new experimental inspection plugin.
To enable this feature, be sure you have
@sveltejs/vite-plugin-svelte
version1.0.0-next.43
or higher, then add the following to yoursvelteOptions
in.storybook/main.js
:Then, when the storybook opens, focus a story iframe and press cmd+shift (mac) or ctrl+shift (windows) to activate.