Vue version

3.2.37

Link to minimal reproduction

https://stackblitz.com/edit/vitejs-vite-nftks5

Steps to reproduce

There are two scripts to launch the minimal reproduction of the App. Here are the steps to reproduce in the terminal :

• chmod +x launchLibrary.sh and chmod +x launchGui.sh
• use two terminals : ./launchLibrary.sh and after the build of the library do ./launchGui.sh in the other terminal
• go to "Open in New Window Live" and open the JS console. The error will show up.

What is expected?

I created an issue a few days ago about this error and I fixed it in Vue CLI by removing the --inline-vue option in build mode. However after the migration to Vite the error is back in dev and production mode.

It is expected to render the Standard component without errors.

What is actually happening?

The Standard component is not rendered.

System Info

No response

Any additional comments?

No response

resolve: {
  dedupe: ['vue']
}

https://vitejs.dev/config/#resolve-dedupe

@LinusBorg Thank you for your response but I've already tested that in vite.config.js and I didn't work. Is there a particular place tu put this option ?

Ypu need to add that to the app's config, not the library's.

module.exports = defineConfig({
  plugins: [vue()],
  resolve: {
    dedupe: ['vue'],
    alias: {
      //vue: path.resolve(`./node_modules/vue`),
      '@': path.resolve(__dirname, './src'),
    },
  },
});

@LinusBorg I already tried that and the error is still triggered.

Stupid question: you did restart vite after that change?

I'll have another look when I'm home, but generally these issues are solved reliably by dedupe. maybe the file: dependency path is a problem? not sure. Either way this is a build tooling problem, not a Vue core problem.

@LinusBorg Thank you for your time. I will check your hint and I already have posted an issue on Vite's GitHub.

Its likely also not a bug in vite, just a question of correct config to make sure one copy of vue is included only.

@LinusBorg Alright I'm going to look around that.

You commented out the setting to externalize vue in your libary's config. This had the same effect as --inline-vue in your Vue CLI project - it included its own copy of Vue.

After that change, dedupe: ['vue'] can do what it should: avoid adding another copy of Vue when the app imports the lib.

GUI config:

module.exports = defineConfig({
  plugins: [vue()],
  resolve: {
    dedupe: ['vue'],
    alias: {
      //vue: path.resolve(`./node_modules/vue`),
      '@': path.resolve(__dirname, './src'),
    },
  },
});

guiLibrary config:

module.exports = defineConfig({
  plugins: [vue()],
  build: {
    lib: {
      entry: path.resolve(__dirname, './src/index.js'),
      formats: ['cjs', 'umd', 'es'],
      name: 'library',
    },
    cssCodeSplit: false,
    assetsInlineLimit: 50000,
    rollupOptions: {
      external: ['vue'],
      output: {
        globals: {
          vue: 'Vue'
        }
      }
  }
  },
  resolve: {
    alias: {
      '@': path.resolve(__dirname, './src'),
    },
  },
});

@LinusBorg Thank you for the help. However in my bigger project I have several errors which look like this : "The requested module '/node_modules/.vite/deps/vue.js?v=46b42f12' does not provide an export named 'default'" when I use dependencies like VueKonva or MDBootstrap. I updated the minimal repro with a simple MDBootstrap component import. Any hint about that ?

We should not use this issue ad a general support ticket.

Please use the discord community, forum or stack oberflow.

Hint: sounds like some deps are for Vue2 (which has a default export)