zoukankan      html  css  js  c++  java
  • 钉钉自带浏览器版本过低,导致Object.assign不兼容...

    最近做了一个移动端项目,提前做完了,上线以后各种没问题,各种浏览器都完美棒棒哒,终于可以给自己加一个鸡腿了。

    But,PM有天给我说,咳咳,为什么页面少了一部分??

    说我的一脸懵逼,然后拿给我看,在钉钉打开项目的地址,页面确实少了一部分,点击各种按钮,皆无提示,看来应该是报错了。

    但是iPhone的钉钉是OK,看来问题出现在安卓版的钉钉上。

    先定位一下问题,检测了一下安卓版钉钉浏览器的内核版本,WTF,竟然是Chrome40,  内心一万匹草泥马呼啸而过。

    然后把页面放到Chrome40上,emmmm, 他喵的竟然不认识 Object,.assign 。真是喵了个喵的。

    好了,问题找到,就解决吧。

    Babel默认只转换新的JavaScript句法(syntax),而不转换新的API,比如Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise等全局对象,以及一些定义在全局对象上的方法(比如Object.assign)都不会转码。举例来说,ES6在Array对象上新增了Array.from方法。Babel就不会转码这个方法。如果想让这个方法运行,必须使用babel-polyfill,为当前环境提供一个垫片。

    Babel默认不转码的API非常多,详细清单可以查看babel-plugin-transform-runtime模块的definitions.js文件。

    解决方案:

    首先,使用 node 安装 *babel-polyfill 命令*
    npm install --save-dev -polyfill

    解决方案1:在 webpack.config.js 文件中,entry 入口处修改,加入即可
    "babel-polyfill":"babel-polyfill",//用来解决的兼容性
    例如:
    entry: {
        "babel-polyfill":"babel-polyfill",//用来解决兼容性
        app: path.resolve(__dirname, config.entry.module + "/app.js"),
        vendor: config.entry.vendor
    },

    解决方案2:不修改webpack的情况下,在你的主入口文件头部加入,例如:app.js中加入即可
    import 'babel-polyfill' 或者 require('babel-polyfill');
    例如:
    import 'babel-polyfill'
    import Vue from 'vue';
    Vue.config.debug = true;

    如果嫌引入babel-polyfill太大,人家还提供了单项的polyfill,比如说我就只用到Object.assign和promise的,详情看这里

  • 相关阅读:
    POJ 3259 Wormholes【BellmanFord】
    POJ 2960 SNim【SG函数的应用】
    ZOJ 3578 Matrixdp水题
    HDU 2897 邂逅明下【bash博弈】
    BellmanFord 算法及其优化【转】
    【转】几个Java的网络爬虫
    thinkphp 反字符 去标签 自动加点 去换行 截取字符串 冰糖
    php 二维数组转 json文本 (jquery datagrid 数据格式) 冰糖
    PHP 汉字转拼音(首拼音,所有拼音) 冰糖
    设为首页与加入收藏 兼容firefox 冰糖
  • 原文地址:https://www.cnblogs.com/hrone/p/9685536.html
Copyright © 2011-2022 走看看