vue cli - 04 浏览器兼容性

browserlistrc文件

.browserslistrc文件指定了要兼容的浏览器，会被 @babel/preset-env 和 Autoprefixer用来确定需需要转移的JS特性或CSS前缀

Pollfill

vue cli用内置的Babel preset来转义代码：@vue/bable-preset-app，包含的特性有：

• @babel/preset-env
• Stage 3 or Below
• Vue JSX： @babel/plugin-syntax-jsx， @vue/babel-preset-jsx
• @babel/plugin-transform-runtime

可通过app babel options添加定制的Pollfill规则

现代模式

目前有很多浏览器支持module方式，Babel针对这样的浏览器可不进行原生转义，这样可以大大降低输出文件的体积。

vue-cli-service build --modern

CLI会生成两种类型的包，一个是支持ES Modules的现代浏览器，一个是兼容旧浏览器

• 现代版的包会通过 <script type="module"> 在被支持的浏览器中加载；它们还会使用 <link rel="module preload"> 进行预加载。
• 旧版的包会通过 <script nomodule> 加载，并会被支持 ES modules 的浏览器忽略。
• 一个针对 Safari 10 中 <script nomodule> 的修复会被自动注入。