search

apexcharts / vue3-apexcharts

📊 Vue-3 component for ApexCharts
MIT License
293 stars 33 forks source link

The requested module '/node_modules/.vite/deps/vue.js?v=6a4bcc3c' does not provide an export named 'default' #82

Open mawshin opened 11 months ago

mawshin commented 11 months ago

I am using vite for development and also to build production JS of components library. I am using vue3-apexcharts for one of the component and it works fine in the npm dev mode. If building the package for production, an error will be reported when using the library in the application:The requested module '/node_modules/.vite/deps/vue.js?v=6a4bcc3c' does not provide an export named 'default'.

Not sure if anyone has encounter this issue before but this would be the common way to import and use vue3-apexcharts:

import apexcharts from "vue3-apexcharts"

But the above will cause error when using the build JS and I have found to fix the issue will have to call the file within the src folder:

import apexcharts from "vue3-apexcharts/src/vue3-apexcharts"

Would be great if anyone knows if it could be a vite build issue or is it something on vue3-apexcharts end which might cause the vite build to have issue.

amanpatel commented 5 months ago

I am also having the same issue. It seems to be a problem with how the project is producing its distributable. Which is in the commonJS format instead of a ES build. Vite is a modern build tool and it has left behind things like commonJS in favor of the modern toolset. This is why you are having this issue.

Unfortunately for me, importing directly from vue3-apexcharts/src/vue3-apexcharts also does not work, so I'm looking at fixing this in another way.

ShwaibLeBon commented 2 months ago

Hey @mawshin and @amanpatel , you should include "vue3-apexcharts" in vite.config.ts' optimizeDeps option like so:

optimizeDeps: {
    include: ["vue3-apexcharts"],
},