Qt 嵌入Vue项目 flapMap 浏览器兼容性问题-Toy模板网

这篇具有很好参考价值的文章主要介绍了Qt 嵌入Vue项目 flapMap 浏览器兼容性问题。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

最近有个需求，Qt工程需要嵌入vue项目，本来是很简单的事情。在我的PC上启动Vue项目，同事PC上用浏览器通过IP地址可以正常加载vue项目，但用Qt嵌入总是失败。问题定位步骤如下：

1）换了一个简单的vue项目，发现没有问题，Qt工程能正常加载vue项目

2）由于Qt不像浏览器那样可以console，或断点定位，所以采用加alert 的方法来定位，最后定位到调用flatMap方法的地方有问题。flapMap是es6语法，猜测是由于Qt自集成的chrome版本低导致，所以升级Qt版本到6，问题解决。

3）由于整个项目是在Qt 低版本开发的，不想采用升级Qt版本来解决。所以修改vue项目来解决。

Vue项目Babel 会把es6语法polyfill 呀，怎么对flatMap没起作用？

看了一下vue项目根目录下的.browserslistrc 文件，并没有对chrome版本进行设置，故增加一行代码解决：Chrome > 55

4）.browserslistrc 解读

Browserslist 帮助我们在浏览器兼容性和包大小之间保持适当的平衡。使用 Browserslist，可以做到覆盖更广泛的受众（浏览器），同时包的体积也会保持最小化。

在vue项目根目录运行npx browserslist 可以查看支持的浏览器。

Autoprefixer、babel-preset-env 等前端工具会使用.browserslist配置来生成适当的CSS和JavaScript代码。

5）通过前面分析得出问题根本原因。vue项目采用.browserslistrc默认配置，没有限定chrome浏览器版本，babel转换后生成的js代码需要的浏览器版本高于Qt自集成的chrome版本。文章来源地址https://www.toymoban.com/news/detail-652832.html

到了这里，关于Qt 嵌入Vue项目 flapMap 浏览器兼容性问题的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！