Version
6.1.0
The v6 migration guide is incorrect for Webpack 5
The official ECharts 6 upgrade guide
says that users can preserve the ECharts 5 appearance by importing the v5
compatibility theme:
import 'echarts/theme/v5';
const chart = echarts.init(document.getElementById('container'), 'v5');
That documented migration path does not work in a strict ESM Webpack 5
application:
- The guide's exact extensionless import,
echarts/theme/v5, fails to resolve.
- Using
echarts/theme/v5.js, the file explicitly named and linked by the
guide, compiles but silently registers the theme on a different ECharts
module instance. Charts therefore retain the ECharts 6 defaults.
As a result, the guide currently gives Webpack users no working import for the
compatibility theme it recommends to avoid visual regressions.
Link to Minimal Reproduction
https://gist.github.com/acdn-tsmith/e3f426c844217682dd6a2aedd4821b88
Steps to Reproduce
- Download the four files in the reproduction.
- Run
npm install.
- Run
npm test.
The reproduction is a direct Webpack 5 application. It follows the guide using
the explicit .js path linked in its prose, initializes an SSR chart with the
v5 theme, and reads the resolved color palette.
Current Behavior
With the guide's exact extensionless import, Webpack reports that
echarts/theme/v5 has no valid exported target and suggests v5.js.
After making that suggested change, the build succeeds, but Webpack includes the
ESM public entry used by the application and a separate ECharts distribution
module reached through the theme's UMD dependency. The side-effect import
registers v5 on that second module instance, not the ECharts instance used by
the application. The chart silently retains the ECharts 6 palette:
Error: Expected v5 color #5470c6, received #5070dd
The Webpack build identifies both echarts/theme/v5.js and
echarts/dist/echarts.js in addition to the application's ESM ECharts modules.
A direct Node ESM import and a Rollup bundle do not reproduce the failure.
Expected Behavior
The migration guide's documented import should resolve and register the v5
compatibility theme on the ECharts instance used by the application:
import * as echarts from 'echarts';
import 'echarts/theme/v5';
echarts.init(element, 'v5');
Both the documented extensionless path and the linked .js path should work.
The resolved first color should be the ECharts 5 value #5470c6.
Environment
- OS: macOS
- Runtime: Node.js 26.8.1
- Bundler: Webpack 5.110.3
- Framework: none
Any additional comments?
An ESM-specific theme entry selected for import would ensure registration uses
the same public ECharts module graph as the application while preserving the
existing UMD file for CommonJS and direct browser-script consumers.
Version
6.1.0
The v6 migration guide is incorrect for Webpack 5
The official ECharts 6 upgrade guide
says that users can preserve the ECharts 5 appearance by importing the v5
compatibility theme:
That documented migration path does not work in a strict ESM Webpack 5
application:
echarts/theme/v5, fails to resolve.echarts/theme/v5.js, the file explicitly named and linked by theguide, compiles but silently registers the theme on a different ECharts
module instance. Charts therefore retain the ECharts 6 defaults.
As a result, the guide currently gives Webpack users no working import for the
compatibility theme it recommends to avoid visual regressions.
Link to Minimal Reproduction
https://gist.github.com/acdn-tsmith/e3f426c844217682dd6a2aedd4821b88
Steps to Reproduce
npm install.npm test.The reproduction is a direct Webpack 5 application. It follows the guide using
the explicit
.jspath linked in its prose, initializes an SSR chart with thev5theme, and reads the resolved color palette.Current Behavior
With the guide's exact extensionless import, Webpack reports that
echarts/theme/v5has no valid exported target and suggestsv5.js.After making that suggested change, the build succeeds, but Webpack includes the
ESM public entry used by the application and a separate ECharts distribution
module reached through the theme's UMD dependency. The side-effect import
registers
v5on that second module instance, not the ECharts instance used bythe application. The chart silently retains the ECharts 6 palette:
The Webpack build identifies both
echarts/theme/v5.jsandecharts/dist/echarts.jsin addition to the application's ESM ECharts modules.A direct Node ESM import and a Rollup bundle do not reproduce the failure.
Expected Behavior
The migration guide's documented import should resolve and register the v5
compatibility theme on the ECharts instance used by the application:
Both the documented extensionless path and the linked
.jspath should work.The resolved first color should be the ECharts 5 value
#5470c6.Environment
Any additional comments?
An ESM-specific theme entry selected for
importwould ensure registration usesthe same public ECharts module graph as the application while preserving the
existing UMD file for CommonJS and direct browser-script consumers.