Bump @vitejs/plugin-vue to 1.10.2

[joshwooding]

This should fix the error reported in #188 (comment)

Since I could run yarn workspace example-react storybook fine the issue looked to be with vite and vue. Bumping the vue plugin fixes it so I assume it's an compatibility issue with the version of the plugin and vite.

cc @IanVS @mrauhu

[joshwooding]

I'm still experiencing the issue #50 with our vue and svelte examples :(

[mrauhu]

@joshwooding

The @vitejs/plugin-vue has a second version:

https://github.com/vitejs/vite/blob/main/packages/plugin-vue/CHANGELOG.md

Can we also update Vue and Vite dependencies to latest versions?

Also, maybe we need update the Storybook dependencies?

[mrauhu]

@joshwooding maybe this setup can help you:

#186 (comment)

    // Needed only for development mode: `npm run storybook`
    config.optimizeDeps = configType === 'PRODUCTION' ? config.optimizeDeps : {
      ...(config.optimizeDeps || {}),
      include: [
        ...(config?.optimizeDeps?.include || []),
        
        // Optional, but prevents error flashing in the Storybook component preview iframe:
        // Fix: failed to fetch dynamically import module, avoid cache miss for dependencies on the first load 
        '@storybook/components',
        '@storybook/store',
        
        // Add all addons that imported in the `preview.js` or `preview.ts` file and used in exported constants
        '@storybook/addon-links'
        '@storybook/theming',
      ],
    }; 

I'm tested it with @vitejs/plugin-vue@2 and latest versions of Vue and Vite.

[joshwooding]

@joshwooding

The @vitejs/plugin-vue has a second version:

https://github.com/vitejs/vite/blob/main/packages/plugin-vue/CHANGELOG.md

Can we also update Vue and Vite dependencies to latest versions?

I saw that, I didn't want to bump a major version but there's not really any harm since it's only example code.

As for bumping vue and vite. I'm not sure if I see it as necessary since they are on their current major versions but it doesn't hurt to keep them up to date so I'm indifferent. I have the same thoughts on the Storybook dependencies.

After saying that I think we should tackle those in a separate PR though since this once is primarily to fix the current issue we're facing.

[joshwooding]

@joshwooding maybe this setup can help you:

#186 (comment)

    // Needed only for development mode: `npm run storybook`
    config.optimizeDeps = configType === 'PRODUCTION' ? config.optimizeDeps : {
      ...(config.optimizeDeps || {}),
      include: [
        ...(config?.optimizeDeps?.include || []),
        
        // Optional, but prevents error flashing in the Storybook component preview iframe:
        // Fix: failed to fetch dynamically import module, avoid cache miss for dependencies on the first load 
        '@storybook/components',
        '@storybook/store',
        
        // Add all addons that imported in the `preview.js` or `preview.ts` file and used in exported constants
        '@storybook/addon-links'
        '@storybook/theming',
      ],
    }; 

Thanks, to get the vue/svelte examples locally is pretty easy you can add:

config.resolve.dedupe = ['@storybook/client-api', 'react']

but I'm not sure if this is the approach we want to take. There was some work in #160 to solve this but it caused other issues.

Edit: It's also worth adding this issue doesn't occur when using storyStoreV7