基于OpenLayers的WebGIS开发之Node JS开发方式的环境配置

基于OpenLayers的WebGIS开发之Node JS开发方式的环境配置

OpenLayers是一种JavaScript功能库，该功能库用于显示地图及空间数据，且实现访问空间数据的方法都符合行业标准。基于OpenLayers功能库的WebGIS系统能够整合、管理、分析地理空间数据，实现地理数据的空间可视化和空间分析。（node.js是一个用来创建服务器端网络应用程序的开发平台）
基于OpenLayers的WebGIS开发有两种方式：一种是传统开发方式；另一种是node.js开发方式。传统开发方式需要将OpenLayers开发库全部放置在项目中，在项目中调用所需要的API，这样整个项目占用内存较大，运行速度也会受限。从OpenLayers 5.0版本开始，建议将应用程序与所需要的项捆绑在一起，即采用node.js开发方式。这样开发者就可以根据自己的需要有针对性地调用模块，不需要将整个OpenLayers开发库导入在项目中，减小了应用程序包的大小，在项目完成之后打包生成轻量的工程。
基于OpenLayers的node.js开发方式，首先需要配置node.js开发环境。由于OpenLayers官网上提供的js包很难下载，本文最后分享了OpenLayers 5.3.0 。
配置Node JS开发环境：
1、在node.js官方网站（https://nodejs.org/en/）下载并安装NodeJS环境以及NPM插件，命令行窗口命令：npm-v；
2、创建一个新的空目录，命令行窗口命令：mkdir e:\ol6Test && e:&& e:\ol6Test;并初始化项目目录，命令行窗口命令：npm init-y;
3、安装cnpm，由于npm中的许多包在国外，安装起来特别慢，为了能够加快安装速度，所以需要利用国内的像服务器，地址为 https://npm.taobao.org ，命令行窗口命令：npm install -g cnpm --registry=https://registry.npm.taobao.org（此命令是安装淘宝镜像）；
4、安装Parcel插件，用于打包应用程序，命令行窗口命令：cnpm install --save-dev parcel-bundler；
5、安装OpenLayers6开发环境，命令行窗口命令：cnpm install ol；
6、在项目目录下新建index.js脚本文件（新建.js脚本之后可以使用其他编辑器如vs code等编写代码）；
7、在项目目录下新建index.html文件，将index.js脚本文件引入；
8、修改package.json配置文件；
9、启动应用程序，命令行窗口命令：cnpm start；
10、应用程序打包，命令行窗口命令：cnpm run build；
11、配置完成后，项目目录下会有一下几个文件：.cache、dist、images、node_modules、package.json、ol-debug.js。
至此，环境配置完成。

百度网盘分享OpenLayers 5.3.0：链接：https://pan.baidu.com/s/1THvFdfyRgarx2CgSoSTkLQ
提取码：4bb1

如有疑问，随时私信。