electron-react-boilerplate集成cesium

关注

VIP免费原创最新推荐文章于 2026-09-11 20:40:52 发布 1.9k 阅读 AI 写同款· GEO 优化 ›

AI权益加码！Claude Code、Cursor等20+工具免费用！购周边限时加赠Coding Plan Lite，畅享主流AI工具！学习进阶更高效！阅读详情

网上找了好久没找到任何electron-react-boilerplate集成cesium的资料
在这里插入图片描述
原因:
1.使用electron-react-boilerplate的人本来就不多
2.使用electron-react-boilerplate并且要集成react-cesium的人就更少了
抠了两天脑壳之后终于搞出来了.

以下是步骤:
首先安装cesium和resium
cnpm install --save cesium resium
然后就是需要注意的地方了
更改webpack配置:
网上的配置各种尝试之后, 还是不行.最后自己结合网上的配置再摸索摸索
首先安装依赖包,
copy-webpack-plugin css-loader style-loader url-loader strip-pragma-loader
可以先查看以下自己的package.json, 缺啥装啥, 我只缺copy-webpack-plugin和strip-pragma-loader, 所以我就是
cnpm install --save-dev copy-webpack-plugin strip-pragma-loader
接下来, 找到项目下的config 文件夹下的 webpack.config.renderer.dev.babel.js 和 webpack.config.renderer.prod.babel.js
以下的配置都是在这两个文件夹中都要配置的哦.

1.定义cesium的路径:

const cesiumSource = 'node_modules/cesium/Source';
const cesiumWorkers = '../Build/Cesium/Workers';

2.更改resolve的alias
原:

  resolve: {
   
   
    alias: {
   
   
      'react-dom': '@hot-loader/react-dom'
    }
  },

改为:

  resolve: {
   
   
    alias: {
   
   
      cesium$: 'cesium/Source/Cesium',
      // cesium$: 'cesium/Cesium',
      cesium: 'cesium/Source',
      'react-dom': '@hot-loader/react-dom'