vue项目在IE浏览器显示空白页(es6语法兼容问题)

近期，在vue项目开发中，遇到了IE浏览器的兼容问题，页面显示空白，且控制台出现如下报错信息：

通过控制台输出的报错信息，定位到app.js文件的3797行代码，发现存在ES6语法。

问题来源：
由于IE浏览器不兼容ES6语法，需要使用Babel将其转换为向后兼容的 JavaScript 语法才能正常运行。

问题分析：
查看了package.json文件，发现关于babel编译所需的依赖均已安装完成，为什么app.js 中还会存在es6语法呢？

于是，打开node_modules文件夹，定位到ansi-style下的index.js文件，发现第三方依赖包的代码是原样输出，并没有被编译。

经过查阅Vue-Cli官方文档，发现默认情况下 babel-loader 会忽略所有 node_modules 中的文件。

解决方案：
vue-cli 为我们提供了transpileDependencies配置，如果想要通过 Babel 显式转译一个依赖，可以在这个选项中列出来。

在vue.config.js中 增加如下代码：

transpileDependencies: ['ansi-styles']

重新启动，在IE浏览器就可以正常运行啦~