#importing vue component into vue component does not work

5 messages · Page 1 of 1 (latest)

violet oriole
#

I'm trying to import a graphing component into my component, but it errors out with "TypeError: Cannot read properties of undefined (reading 'default')"

I've tried it with several charting components and they all have the same error.

I created a sample project to show the error:
https://github.com/skidvis/astro-vue-error/blob/main/src/components/Test.vue

The error is as follows:
error Cannot read properties of undefined (reading 'default')
File:
C:\Github\error\C:\Github\error\C:\Github\error\src\components\Test.vue:12:21
Stacktrace:
TypeError: Cannot read properties of undefined (reading 'default')
at C:/Github/error/src/components/Test.vue:12:21
at async instantiateModule (file:///C:/Github/error/node_modules/.pnpm/vite@4.1.4/node_modules/vite/dist/node/chunks/dep-ca21228b.js:52420:9)

According to the vue docs, I'm registering the component correctly:
https://vuejs.org/guide/components/registration.html#local-registration

Can someone point me in the right direction?

bright pebble
#

If you replace the trading-vue-js component with a custom placeholder Vue component in your project, does it work? That would tell you whether it is a version mismatch or something else.

violet oriole
#

yeah if I make my own component and import it, then it works, but so far no dice with any other component I've tried.
You're right about this one being Vue2, but I get the same error even with Vue3 components like vue3-apexcharts and vue-chart-3.

#

after some tinkering, I got vue-chart-3 to work. Thanks for your help!