Is Vite able to import some component library like PrimeVue?

[Zony-Zhao]

I tried to use PrimeVue with vite. The module just cannot resolve correctly.

I imported a .vue file of this lib(sidebar.vue) like so:

get error like

because Ripple is imported this way,in the source file of the lib(SideBar.vue)

and feel really hard to integrate.

my package.json

1. Is there any workaround or any component lib to choose from at this time?
2. Is this intended to be hard to work with component libs that use webpack?

[underfin]

See #178 (comment)

[Zony-Zhao]

@underfin I know I need to import .vue.

But 'Ripple' is just a js file. And trigger error as the Image above. Please look into it carefully.

[underfin]

Oh. Sorry, it caused by Ripple is a common js module. It is not supported by default with vite.
You can add below code into vite.config.js as a workaround, but It's better if you ask the maintainer of primevue export es module.

optimizeDeps: {
    include: ['primevue/components/utils/DomHandler', 'primevue/components/ripple/Ripple'],
  },