vue项目兼容ie浏览器

一、关于babel-polyfill（模拟ES2015以上的环境，主要用于对ES6新语法不支持的浏览器）
1、安装：
npm install --save babel-polyfill；

2、配置（webpack.base.conf.js）：

module.exports = { entry: ["babel-polyfill", "./src/main.js"] };

3、main.js中配置：

import 'babel-polyfill' //放在最顶部，确保全面加载

二、es6-promise不兼容
1,安装：

npm install es6-promise

2,在main.js中加入

require('es6-promise').polyfill()

3,解决报错：
Cannot assign to read only property 'exports' of object '#<Object>'

npm install --save-dev babel-plugin-transform-es2015-modules-commonjs

以上步骤操作完成即可在ie打开页面
其他可能出现的问题：
1，操作完数据后页面没有更新，可以在main.js里当接口请求时加上时间戳

Axiso.interceptors.request.use(function (config) {
    var access_token = localStorage.getItem("logintoken")

    if (config.method == 'post') {
        config.params = {
            _t: Date.parse(new Date()) / 1000,
            ...config.params
          }
      } else if (config.method == 'get') {
        config.params = {
          _t: Date.parse(new Date()) / 1000,
          ...config.params
        }
      }

    // 
    return config;
}, function (error) {
    return Promise.reject(error);
});

2，ie提示const必须初始化
each.js修改为

export default function(callback, that) {
  let index = -1;
  for (var node of this) {
    callback.call(that, node, ++index, this);
  }
  return this;
}

3,报错以下未定的错

image.png

es6转es5！

npm i babel-preset-es2015

在项目的根目录下，修改.babelrc的内容，添加'es2015'

image.png

接着会报以下错误

image.png
安装 npm i classlist-polyfill,并且在base.config.js中，添加'classlist-polyfill'
image.png