Vite: Add vue-vite framework for Vue2 #19230
Conversation
Otherwise we end up with type problems between different versions.
It's only used in the react framework, and doesn't need to be exported
Webpack doesn't need them, but Vite does
|
I didn't deploy my repro template, which sounds like it might break CI due to the vue2 renderer not working. So, I'd say this PR isn't ready to merge, and is blocked by #19207. |
| 'vue2-vite/2.7-js': { | ||
| name: 'Vue2 Vite (vue 2.7 JS)', | ||
| script: | ||
| 'yarn create vite . --template vanilla && yarn add --dev @vitejs/plugin-vue2 vue-template-compiler vue@2 && echo "import vue2 from \'@vitejs/plugin-vue2\';\n\nexport default {\n\tplugins: [vue2()]\n};" > vite.config.js', |
There was a problem hiding this comment.
@ndelangen WDYT about this? we said we were going to only use community bootstrap tools for this. do we use this as a placeholder for now & then move to some storybook package later?
There was a problem hiding this comment.
Let's discuss this, I'm obviously not a fan of this, because in 2 weeks no-one will know why any of it is here, and it won't reproduce anything users are actually using.
There was a problem hiding this comment.
The challenge is, there's no generator / bootstrap for using Vue 2 with Vite, as far as I could find. Vue 2 had its own cli, and it's necessary to create a Vue 2 project and then manually convert it over to Vite. Or, this approach which required fewer changes, which is to add a vanilla Vite project, and then add Vue2 into it.
There was a problem hiding this comment.
understood! thank you for the explanation, let's do a follow up at some point to extract this into the public domain in some sort of CLI project generator.
|
I'm going to leave a TODO comment in the code to say that we should create a Also, I'll make a PR to remove the |
# Conflicts: # code/yarn.lock
|
@IanVS Looks like it's not generating in the the directory you want it to: |
|
I think the issue is that I did not actually build and release the repro into https://github.com/storybookjs/repro-templates-temp. I was reluctant to do that until #19204 is fixed, since otherwise I guess CI will start to fail everywhere, right @shilman? I guess this is on-hold until that's figured out. Sorry, shouldn't have tagged you for review Norbert, I forgot that was still a problem. |
|
Waiting for this to be merged here |
shilman
changed the title
There was a problem hiding this comment.
There are some messed up chromatic snapshots (controls, etc.), also failing in my previous Vue2 PR. I'm going to merge this PR and follow up separately. It's too painful to deal with the lack of cached repro template. In the future, we should split up the PRs so that we can merge the repro templates first and then iterates on CI errors with a stable repro.
Issue: #18293
What I did
This adds a new framework for vue2 and vite,
@storybook/vue-vite. It also adds a reproduction, but it sounds like we may need to comment that out for now until we get vue2 playing nicely in CI.TODO:
vue-loaderinto Vite projects. The same goes forsvelte-loaderas well, in svelte-vite projects. (Vite: Do not add Webpack loaders when using Vite builder #19263)How to test
yarn bootstrap --buildyarn generate-repros-next --template vue2-vite/2.7-js --local-registrycd ../repros/vue2-vite/2.7-js/after-storybookyarn storybook