In some environments, Nuxt seems to have trouble rendering ECharts.

[hexWars]

Environment

• Operating System: Windows_NT
• Node Version: v20.10.0
• Nuxt Version: 3.10.2
• CLI Version: 3.10.1
• Nitro Version: 2.8.1
• Package Manager: npm@10.2.3
• Builder: -
• User Config: ssr, devtools, modules, build
• Runtime Modules: @nuxtjs/tailwindcss@6.11.4, nuxt-icons@3.2.1
• Build Modules: -

Reproduction

https://stackblitz.com/edit/github-8ahe5c

Describe the bug

I'm not sure if it's a problem with Nuxt, but in the example, Nuxt 3 seems unable to render ECharts 5. Unfortunately, I can't seem to resolve it. I would greatly appreciate it if you could help me with this.

Additional context

No response

Logs

No response

[stackblitz]

Start a new pull request in StackBlitz Codeflow.

• github-8ahe5c (Open reproduction)

[danielroe]

You need to give the DOM element a height/width.

Adding this fixes the issue in your reproduction:

<style>
.echart {
  width: 500px;
  height: 500px;
}
</style>

[hexWars]

Thank you