question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

esm support and nuxt3 says there is a fix needed for esm?

See original GitHub issue

Expected behavior

Right now nuxt build fails iwth

[nuxt] [request error] Named export 'BarElement' not found. The requested module 'chart.js' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from 'chart.js';

accroding to the docs of nuxt: https://v3.nuxtjs.org/guide/going-further/esm/#troubleshooting-esm-issues

this is a library issue and can be fixed by: https://v3.nuxtjs.org/guide/going-further/esm/#library-author-guide

what’s your point of view to that?

Current behavior

not possible to use with nuxt3 / esbuild.

Reproducible sample

no-example

Optional extra steps/info to reproduce

No response

Possible solution

No response

Context

No response

chart.js version

3.9.1

Browser name and version

No response

Link to your project

No response

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:16 (2 by maintainers)

github_iconTop GitHub Comments

2reactions
mykkodecommented, Aug 26, 2022

Using the following libraries: "vue-chartjs": "^4.1.1", "chart.js": "^3.9.1"

and the following import statement

import { Line } from 'vue-chartjs' import { Chart, LineElement, PointElement, CategoryScale } from 'chart.js/dist/chart.mjs'

In nuxt 3 I can use chart.js in both dev mode and build+preview mode.

1reaction
LeeLenaleeecommented, Oct 12, 2022

Issue seems like it is fixed in V4. When I install the alpha of Chart.js yarn add chart.js@next it shows the chart after running yarn build and yarn start.

@zumm can you try to check if it also works for you since my experience with nuxt is next to 0

Project I tested it in: https://github.com/LeeLenaleee/nuxt-chartjs-import-bug

Read more comments on GitHub >

github_iconTop Results From Across the Web

ES Modules · Nuxt Concepts
The good news is that it's relatively simple to fix issues of ESM compatibility. There are two main options: You can rename your...
Read more >
Error [ERR_REQUIRE_ESM] require() of ES Module not ...
i'm trying to use nuxt 3 for create a web app and it's work very fine on my desktop with the version 17.3.0...
Read more >
Server-Side Rendering
Vite provides built-in support for server-side rendering (SSR). ... ssrLoadModule automatically transforms // your ESM source code to be usable in Node.js!
Read more >
Vite 3 is here! What's new + how to migrate
Node 14.18+ is now required for Vite to run. Vite is now published as an ECMAScript Module (ESM) with a CJS proxy to...
Read more >
How to Fix "SyntaxError: Cannot use import statement ...
One of the most confusing parts of the Node ecosystem is that it contains two different module systems, ESM (ECMAScript Modules) and ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found