前言
由于工作需要，最近一直在基于
Openlayers做一个项目的开发。记得上次用Openlayers做项目还是16年的时候了，当时用的版本是2.X，而今天写这篇文章时的版本则是Openlayers官网最新版Openlayers 6.2.1。 个人认为这个版本充分体现了ES6面向对象的模块化编程思想，通过对开发包中不同功能的类的导入进行相关的函数调用。需要注意的是：现在基于Openlayers做开发，最好是在Node环境下，这样既能减少错误的发生，也更容易对接官方的API。（想对没用过Node开发环境的童鞋说一下，如果只通过Node环境来做简单的前端功能开发，是非常简单的，完全不用因为不懂而畏惧。）
项目环境搭建
Node 环境的搭建我这里默认各位童鞋已经做好了，那么问题来了，我们应该怎么把最新的 OpenLayers 安装到自己的项目中呢？
1. 在项目根目录下初始化 Node 环境 （如果有童鞋直接用 IDE 创建了 Node 项目这一步可以跳过）
npm init
2. 安装 OpenLayers 最新插件 （这样我们就把最新的 OpenLayers 的库安装进了自己的项目中）
npm install ol
3. 安装 parcel 打包工具 （这是一个新的代码打包工具与 webpack 功能相似，但更简单）
npm install --save-dev parcel-bundler
4. 在 package.json 根节点内配置 script （注意下面代码里的 index.html 文件，它是打包程序的入口文件，这里大家根据自己的实际情况配置即可）
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "parcel index.html",
"build": "parcel build --public-url . index.html"
}
5. 安装 parcel 清理工具 （这个工具是为了在项目运行打包命令是能够自动清空 dist 文件夹下的文件）
npm i parcel-plugin-clean-dist
6. 安装 bable 插件 （这个工具是为了将开发过程中用到的部分 ES6 写法转为 ES5写法，这里强调部分是因为，并不是所有 ES6 写法都可以被 bable 插件转化为 ES5 的）
npm install --save-dev @babel/preset-env
7. 在 package.json 根节点内配置 bable （既然装了 bable 那就配上呀~！）
"babel": {
"presets": [
"@babel/preset-env"
]
}
8. parcel 配置自定义端口 （端口是一个开发环境中的可选配置，可避免默认的 1234 端口与其它程序出现冲突）
parcel -p 12345 index.html