vue-cli4的浏览器兼容babel的配置

实现方法步骤：

1. 下载babel-polyfill以及es6-promise

cnpm install --save babel-polyfill es6-promise

2.在main.js顶部进行引入

import 'babel-polyfill'

import promise from 'es6-promise'

promise.polyfill()

3.为防止vue-router在ie中不起作用添加一下代码(可以不写）

new Vue({

  router,

  store,

  // render: (h) => h(App),

  render: function (createElement) {

        if ('-ms-scroll-limit' in document.documentElement.style && '-ms-ime-align' in document.documentElement.style) {

          window.addEventListener('hashchange', () => {

            var currentPath = window.location.hash.slice(1)

            if (this.$route.path !== currentPath) {

              this.$router.push(currentPath)

            }

          }, false)

        }

        return createElement(App);

      }

}).$mount('#app');

4. 配置vue.config.js

 

// 如果你不知道自己的第三方依赖道理有多少，就像我这样全局都进行引入。这样更方便，但是缺点就是对于不需要转化的包也进行转化

transpileDependencies: process.env.NODE_ENV === "development" ? ["*"] : [],

configureWebpack: (config) => {

        config.entry.app = ["babel-polyfill", "./src/main.js"];

}

 

参考：https://cli.vuejs.org/zh/config/

https://www.cnblogs.com/chun321/p/13070553.html  vue-cli的浏览器兼容babel的配置

https://www.jianshu.com/p/c95fcdd7853f  vue-cli4+ts+element如何实现兼容ie10以上浏览器