使用esri-loader的坑

问题描述：

在vue框架的项目中加载地图，esri官方提供的esri-loader，下载命令：npm install --save esri-loader，使用esri-loader在chrome浏览器下的确可以正常加载地图，但是我在ie11下却会报“Promise”未定义的错误（前提我的项目已经通过babel将es6的代码编译成es5了依然报错）。

下图1,2是在ie下调试打断点找到的错误，在ie11浏览器下esri-load.js文件中显示Promise未定义，所以变量utils会为undefined如下图1，这样会导致在后面使用esri-load引入arcgis api的包时在使用util的时候会报错如下图2，在ie11浏览器访问将会报很奇怪的错误如下图3，4。

图1：

图2：

图3：

图4：

解决办法

首先安装：babel-polyfill

安装命令：npm install babel-polyfill --save

然后在vue-cli中，在build目录下的webpack.base.conf.js文件里找到entry，添加babel-polyfill，写法如下：

entry: {
  app: ['babel-polyfill','./src/main.js']
}

添加完后重新执行npm run dev重启项目，那么在ie11下就可以正常加载地图，不会报错了。

下图，图1为vue框架webpack.base.conf.js修改之前的内容，图2为修改后的内容

图1：

图2

强行解释一波：vue-cli项目里默认有babel转码器，但是babel默认只是转新的js语法（syntax），不会转换新的api，

比如：Iterator，Generator、Set、Maps、Proxy、Reflect、Symbol、Promise等全局对象，

以及一些定义对象上的方法（比如Object.assign）等好像都不会转码。

举例：es6在Array对象上新增了remove方法，那么bebel就不会对这个方法进行转码，如果想转码运行，

那么就要使用babel-polyfill。

（也许是因为上面的原因吧，导致我的vue项目使用esri-loader加载地图在ie11浏览器会报错的原因吧，

是不是这个原因我也不太确定，看到这篇文章的人，如有更好的结论解析，希望提供一下）