Closed AndreyYolkin closed 8 months ago
I'm sorry to close this issue for it lacks the necessary title. Please provide a descriptive and as concise as possible title to describe your problems or requests and then the maintainers or I will reopen this issue.
Every good bug report or feature request starts with a title. Your issue title is a critical element as it's the first thing maintainers see.
A good issue title makes it easier for maintainers to understand what the issue is, easily locate it, and know what steps they'll need to take to fix it.
Moreover, it's better to include keywords, as this makes it easier to find the issue self and similar issues in searches.
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.
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
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
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
@FibreFoX any workaround or fixes to get jest working with minimal bundle?
@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>
Cool Thanks for this.
@FibreFoX , when you implemented echarts in your repo, did you face any GC heap out of memory error.
Im using NextJs and I keep getting out of memory error during the next build
. I have also tried increasing the node options to 5 gigs like this NODE_OPTIONS=\"--max_old_space_size=5120\"
but still no luck and even with tree shakeable version I'm getting this error.
This is how I have implemented the echarts in my app
` const chartRef = React.useRef
function resizeChart() {
chart?.resize();
}
window.addEventListener('resize', resizeChart);
chart.setOption(option);
// Return cleanup function
return () => {
chart.dispose();
window.removeEventListener('resize', resizeChart);
};
}, [option]);
@Sujith1799 Thats a different topic, please let this thread stay "clean" on the original topic please. (but no, I haven't seen the problem, as I use React with this wrapper component: https://github.com/hustcc/echarts-for-react)
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)
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';
Same problem using Node, Vite and echarts 5.4.2.
export * from './lib/export/core.js';
^^^^^^
SyntaxError: Unexpected token 'export'
...
Same issue for me.
Nuxt 3.8.2 & latest echarts.
Same problem for me. next@12.3.4 and echarts@5.4.2
Fixed by #19513
Version
5.3.1
Link to Minimal Reproduction
No response
Steps to Reproduce
Create app with nuxt bridge Build that app using nuxi build preview this app using nuxi preview
Current Behavior
Node throws error while trying import package as cjs module
Expected Behavior
Node import package as esm module
Environment
Any additional comments?
After building the application with nuxt bridge and running the application, Node tryes to import echarts and zrender as CJS modules, but there are ESM, as I can see. After I specified "type": "module" in both packages, the problem has been solved.
Please specify module type in package.json