浏览器兼容

配置兼容性

你的/package.json文件应包含browserslist字段。这将告诉Quasar应用程序项目的目标浏览器范围。Babel和Autoprefixer将使用此字段来确定如何传输JS代码(如果transpling处于启用状态),以及需要哪些CSS vendor前缀来添加CSS代码。

Babel将寻找需要转换的JS特性(基于配置的浏览器)并应用它们。但是请注意,因为在选项列表中添加一个“坏苹果”就足够了,这将使您的代码回到ES5。

以下是创建Quasar项目时的默认“browserslist”:

// package.json

"browserslist": [
  "last 10 Chrome versions",
  "last 10 Firefox versions",
  "last 4 Edge versions",
  "last 7 Safari versions",
  "last 8 Android versions",
  "last 8 ChromeAndroid versions",
  "last 8 FirefoxAndroid versions",
  "last 10 iOS versions",
  "last 5 Opera versions"
]

有关如何指定浏览器范围的详细信息:browserslist

IE 11支持

为了支持Internet Explorer 11,您需要在/package.json编辑browserslist:

"browserslist": [
  "ie 11", // <<-- add it
  ...
]

就这样。这将注入Promise polyfill,以及其他一些更小的polyfill,为您的包添加额外的大约6k大小的代码(已压缩)。查阅Github去看下具体实现。

IE Polyfills

Quasar CLI足够聪明,只在真正需要的时候才包含IE polyfill。例如,一个Electron应用程序不需要它,因此,即使你在你的package.json > browserslist中留下ie 11它也不会添加polyfill。

WARNING

在Windows计算机上运行dev-server并使用IE11中的输出可能会导致错误(webpack dev server使用了与ansi-strip包相关的包)。这就是为什么您可能需要在package.json(本版使用yarn和pin)中保持严格的"strip-ansi": "=3.0.1"依赖。