Problem with using module exporting and highcharts-more in composition API vue 3 and with script setup

[oghme]

Hi,

I get an error when I try to create a component in composition API Vue 3 with script setup. Here is my component :

This is the error that appears on my page :

[Vue warn]: Component is missing template or render function. at <Anonymous class="hc" options= {chart: {…}, title: {…}, pane: {…}, xAxis: {…}, yAxis: {…}, …} > at <SpiderwebChart title="Ceci est un test !!!" x-data= (6) ['Sales', 'Marketing', 'Development', 'Customer Support', 'Information Technology', 'Administration'] y-data= (2) [{…}, {…}] > at <DropDownSearchPage onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< Proxy(Object) {…} > > at <RouterView> at <DemoPage>

If you have a way to solve this problem that would be great. Thank you in advance for your answers.

[jszuminski]

Hi @oghme, thanks for reporting!

Could you please try to reproduce this is an online code editor so I can investigate this further? (minimal reproducible example)

Thanks in advance!

[oghme]

Hi,

Thank you for your reply. I've identified my problem and found a solution. You shouldn't import highcharts with this name in component (in my exemple SpiderwebChart.vue) :

import Highcharts from "highcharts"; as in the examples

But put another name like this :

import hc from "highcharts";

For more information here is my code

[jszuminski]

Thanks! You're absolutely right - by default, HighchartsVue registers the Highcharts component which was the cause of the naming conflict. I'm glad that you've found the solution.