Cesium搭建源码调试环境的流程

1.前言

最近在对Cesium源码进行学习,因为打算用的是谷歌浏览器的开发者工具进行源码的调试,在网上查了折腾半天才弄起来,所以记录一下。方便有这方面需求的同行们更好的去学习Cesium源码(毕竟Cesium这种基于状态的逐帧进行调度的模式的架构,直接VSCode跑起来看源码还是很抽象的),所以这里记录了直接傻瓜式一步到位搭建起源代码调试环境。(如果不想听废话直接拉到最后看省流版)

2.搭建步骤

2.1准备Cesium源码

这里没什么好介绍的,直接去github上去clone一个就行。这里给去链接直接传送github.com/CesiumGS/ce...

2.2依赖Cesium依赖

要想启动Cesium呢,必须得安装所需要的依赖,这里借助node直接通过npm的方式安装依赖。

js 复制代码
npm install

2.3打包

按理来说经过npm install安装完依赖之后,是可以直接启动Cesium源码了,但是通过npm run start把代码跑起来,进入到提供的helloWorld页面时候却启动不起来。

根据报错内容发现找不到Cesium对象?页面中明明通过script标签引入了Cesium。然后查看文件夹目录发现Build文件夹下没有CesiumUnminified/Cesium.js这个文件,所以找不到。既然没有为啥官方还是这么引用?这里不兜圈子,没有的话就给它直接弄一个出来,这里就需要将这个build文件弄出来,,因为Cesium主要是用gulp进行打包的,所以我们也跟着它的脚步这么干,所以紧着这执行这个命令行,全局安装是上gulp

js 复制代码
npm install gulp -g

当安装完之后,在对应的源码文件夹中打开CMD,输入以下命令,等待安装完毕即可。

js 复制代码
gulp build

在打包完之后,可以看到Build文件夹下出现了我们需要的Cesium.js文件!大功告成。

最后通过npm run start启动项目,就可以在谷歌浏览器的开发中工具中打断点调试源码了。当然这里还会报错,因为没有Token,怎么获取这个token网上资料很多我就多叙述了。

省流版

js 复制代码
//github拉源码
1.拉源码
//源码文件夹下
2.npm install

3.npm install gulp -g

4.gulp buiild

5.npm run start

大功告成!
相关推荐
恋猫de小郭20 分钟前
Flutter 状态管理基准测评,一个很有趣的观点
android·前端·flutter
雪芽蓝域zzs25 分钟前
前端编辑组件wangEditor
前端
风骏时光牛马1 小时前
稳定性治理及疑难问题深度剖析与实战复盘
前端
JeffongTan9 小时前
在LWC中镶嵌VF Page获取用户IP
前端·javascript·salesforce
陆枫Larry11 小时前
Astro 是什么
前端
是立不是利13 小时前
写给设计师的 CSS 博客美学指南
前端·css
默_笙14 小时前
🏝 Docker 就是"房地产开发":从施工图纸到小区物业的容器化指南
前端·javascript
计算机魔术师14 小时前
Rohan Paul 谈用时间跨度衡量智能体能力,并引用 OpenAI 自动化研究实习生里程碑
前端
kyriewen14 小时前
我手写了个极简版 React Router——才搞懂 v6 为什么砍了这么多 API
前端·javascript·程序员