ECharts从v4升级到v5：Module not found: Error: Can't resolve 'echarts/map/js/china'

ECharts 5.0 中国地图数据加载问题解决方案

问题描述

在将 ECharts 从 v4 升级到 v5 版本时，常会遇到以下错误：

Module not found: Error: Can't resolve 'echarts/map/js/china'

这是因为 ECharts 5.0 之后不再内置地图数据，需要我们手动引入地图 JSON 数据。

解决方案

从 ECharts v4 版本中获取中国地图 JSON 数据（可以在 node_modules 中找到，或从官方仓库下载）
在项目中创建地图 JSON 文件，例如 china.json
使用 registerMap 方法注册地图数据：

import * as echarts from 'echarts';
import chinaJson from './china.json';

// 注册地图数据
echarts.registerMap('china', chinaJson);

然后就可以正常使用地图了：

option = {
  series: [{
    type: 'map',
    map: 'china',
    // ... 其他配置
  }]
};

代码示例

就像你的代码中展示的那样：

import chinaJson from '@/utils/china.json';

class Index extends React.Component {
  constructor(props) {
    super(props);
    echarts.registerMap('china', chinaJson);
    // ... 其他代码
  }
}

注意事项

确保 JSON 文件格式正确，包含必要的地理信息数据
建议将地图数据文件放在项目的静态资源目录中
如果需要其他省份或世界地图，也可以用类似方式处理

这种方式虽然需要手动管理地图数据，但也带来了更大的灵活性，可以自定义地图数据，或者按需加载以减小打包体积。