矫情的前言
之前没用过什么npm、react的,着实好顿折腾!
渲染上还有些问题,不过样式和地图都能出来了,问题还是不少的,毕竟也不专业js,重要的是能跑出个例子了,且做个记录做备用。
可参考方法(主要还得看官方的):
①http://blog.csdn.net/future_todo/article/details/72846952
②https://uber.github.io/deck.gl/#/documentation/getting-started/installation
③https://github.com/uber/deck.gl/tree/4.1-release
∴Ctrl+C终止当前执行的任务
开始记录
第一步:安装Node.js,安装node.js后,npm也可以使用了(可能是附带了?),具体安装方法另行百度
第二步:下载deck.gl,cmd转至该目录下,或在目录下用git bash。【其实只用到了里面的example,不过正经做的话肯定是都需要的】
git clone https://github.com/uber/deck.gl.git
第三步:
以官网的GETTING STARTED的Installation为参考进行,拷贝出一个例子,本文针对单个例子进行。
npm install --save deck.gl luma.gl
npm install --save react-map-gl babel-runtime
注1:deck.gl基于luma.gl,所以需要安装luma.gl
注2:react-map-gl和babel-runtime在后面会用到,babel-runtime不装会报错
注3:npm执行操作,warn的可以先不管,Error的必须改
注4:warn里面有提到缺react和react-dom,感觉有用,但是实践中好像没什么影响,如果有碰到具体问题可以考虑机上
第四步 安装依赖包(估计是这个意思吧)
npm install
# 或yarn install
注1:这里会根据package.json进行配置
注2:提示有三个东西挪了位置,建议安装xxx,暂时不管
注3:提示fsevents@^1.0.0......,表示在windows系统下执行了linux的语句,不管
第五步:申请mapbox的key,需要注册账号,免费的
第六步:配置mapbox地图key,并启动运行,注意填写时不要带上大括号{}!!!,
export MapboxAccessToken=pk.eyJ1Ij...... && npm start
注1:省略号表示剩余的key字符串
注2:成功启动会显示webpack:Compiled successfully
注3:360浏览器会有问题,推荐用google浏览器