关于 vue-cli 项目兼容 IE 的内容,请查看 https://cloud.tencent.com/developer/article/1869378
本文针对 babel 7.4.0+ ,处理方式仍然是寻找相应 Babel polyfill。
这里我们仍然采用官方「第3种」 方式。
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
],
plugins: [
'add-module-exports'
]
}
main.js
)增加相关 polyfill。main.js 放到开头处
import 'core-js/stable'
import 'regenerator-runtime/runtime'
这里无需增加任何依赖!
index.html
文件中引入 es6-proxy-polyfill.js
<script src = "https://cdn.jsdelivr.net/npm/proxy-polyfill@0.3.0/proxy.min.js">script>
根据项目实际情况,看是否有必要引入。如果引入,建议下载到本地,再引入。
默认情况下 babel-loader
会忽略所有 node_modules
中的文件。如果你想要通过 Babel 显式转译一个依赖,可以在 transpileDependencies 选项中列出来。
这里,使用 babel 对 elementUI、vuex(需要 Promise polyfill – Here) 进行转换
按照 Vue CLI 提供的 第 1 种方案:
如果该依赖基于一个目标环境不支持的 ES 版本撰写: 将其添加到
vue.config.js
中的transpileDependencies
选项。这会为该依赖同时开启语法转换和根据使用情况检测 polyfill。
vue.config.js
transpileDependencies: [/node_modules[/\\\\](element-ui|vuex|)[/\\\\]/],
根据你的项目实际情况,动态选择处理第三方依赖
new Router({
mode: 'hash'
})
或者,增加 fallback 参数
new Router({
mode: 'history',
fallback: true
})
其默认值为true
,也可以显式声明。