echarts: [Bug] package.json is missing a package "type": "module" description

This is a bug. import * as echarts from 'echarts/core' leads to

export * from './lib/export/core.js';
^^^^^^

SyntaxError: Unexpected token 'export'
    at Object.compileFunction (node:vm:352:18)
    at wrapSafe (node:internal/modules/cjs/loader:1033:15)
    at Module._compile (node:internal/modules/cjs/loader:1069:27)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1159:10)

because the content of .js files is determined by the value for type in the closest package.json.

A proper fix for this requires a major release, as it affects the way current users import (or require) echarts. If you want to continue supporting cjs you need an exports map. A guide for releasing dual packages can be found here https://antfu.me/posts/publish-esm-and-cjs

Alternatively an echarts-esm package could be forked/released that no longer supports cjs

One possible workaround to fix this within 5.x would be to add files with explicit .mjs extension for all current js files that are imported anywhere or used as entry points.

ps. zrender has a similar issue.

Hi, any updates for the issue ? I’m also stuck and got this error when i tried to compil my app.

import * as echarts from 'echarts' with echarts 5.4.1

export * from './lib/export/charts.js';
^^^^^^

SyntaxError: Unexpected token 'export'
    at wrapSafe (internal/modules/cjs/loader.js:1001:16)
    at Module._compile (internal/modules/cjs/loader.js:1049:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1114:10)
    at Module.load (internal/modules/cjs/loader.js:950:32)
    at Function.Module._load (internal/modules/cjs/loader.js:790:12)
    at Module.require (internal/modules/cjs/loader.js:974:19)
    at require (internal/modules/cjs/helpers.js:101:18)

Cannot make echarts working with vitest because of this issue. Please considering fixing package.json according to this guide: https://github.com/sheremet-va/dual-packaging

Same problem using Node, Vite and echarts 5.4.2.

export * from './lib/export/core.js';
^^^^^^

SyntaxError: Unexpected token 'export'
  ...

Bump, this feature is really important as Vite-based framework sometimes does not work with this format. @100pah sorry for mentioning, but may you ship this at 5,5 or nearest milestones. https://github.com/sheremet-va/dual-packaging requires only does not require a lot

Same issue for me.

Nuxt 3.8.2 & latest echarts.

similar issue here in fact import * as echarts from "echarts" does work, but import * as echarts from "echarts/core" doesn’t. Error: export * from './lib/export/core.js';

Having this only as ESM makes it unusable following the “minimal bundle” instructions when using CRA/using Jest. https://github.com/facebook/create-react-app/issues/12063

It is impossible to run tests, but works fine while building or developing … makes the “minimal bundle” with TypeScripts unusable.

Relating other issues: https://github.com/apache/echarts/issues/14864 https://github.com/apache/echarts/issues/14965

Fixed by #19513

@Sujith1799 not yet, the only workaround I know is to not import the page when testing, as suggested here: https://github.com/facebook/create-react-app/issues/12063#issuecomment-1215725669

Something like this:

    // important: exclude this from testing, because Jest is unable to work with Apache EChart
    //  https://github.com/facebook/create-react-app/issues/12063
    const YourComponentWithEcharts = (process.env.NODE_ENV === "test") ? (() => {
        return null;
    }) : lazy(() => import("./YourComponentWithEcharts"));

This does not “make it testable”, it just makes jest jump over the problematic stuff (until its fixed).

Just remember as this uses the lazy-loading stuff, to wrap a <Suspense> around it:

                    <Suspense fallback={<PageLoadingSkeleton />}>
                        <YourComponentWithEcharts/>
                    </Suspense>