umi3 在android 4.4无法运行

Created on 23 Mar 2020 · 12Comments · Source: umijs/umi

What happens?

umi3 在android 4.4无法运行，targets已经加了 android: 4.4
报Uncaught SyntaxError: Use of const in strict mode.的错误
dev, build都无法运行

Mini Showcase Repository(REQUIRED)

Provide a mini GitHub repository which can reproduce the issue. Use yarn create @umijs/umi-app then upload to your GitHub

How To Reproduce

Steps to reproduce the behavior: 1. 2.

Expected behavior 1. 2.

Context

Umi Version:3.0.13
Node Version:12.16.1
Platform:mac

type(bug)

Source

huangang

Most helpful comment

找到原因了，今天这周修。

sorrycc on 25 Mar 2020

👍5

All 12 comments

发现好像是生成的umi.js没有根据targets去编译

huangang on 23 Mar 2020

排查下 const 在哪个文件里出现？

sorrycc on 24 Mar 2020

排查下 const 在哪个文件里出现？

umi.js这个文件出现的

huangang on 24 Mar 2020

这要吓死个人啊，我得赶紧切回去

xusai2014 on 24 Mar 2020

给一个重现demo？我这里没什么问题

xiaohuoni on 24 Mar 2020

给一个重现demo？我这里没什么问题

在android4.4上面用原生的浏览器测试是有问题的，装个最新的谷歌浏览器是没问题的
https://github.com/huangang/umi3-call-demo

huangang on 24 Mar 2020

感觉问题就是编译生成的umi.js, const 这样es6或者更新语法能不能编译到低版本兼容的写法？

huangang on 24 Mar 2020

最简单的方式拿到这个文件全局搜索一下，就成了。没那么麻烦。

xusai2014 on 24 Mar 2020

混淆后的文件，或许有一定的阅读性

xusai2014 on 24 Mar 2020

找到原因了，今天这周修。

sorrycc on 25 Mar 2020

👍5

react-intl的语法降级问题，在plugin-locale中选择降级方案。想向社区做贡献奈何一堆穿越式包引入方案，没太搞懂，请教一下umi整体的bundle方案。

xusai2014 on 26 Mar 2020

项目要上线了，umi这个问题还没修复
搞了个临时解决方案：

安装一些依赖: npm i core-js @babel/cli @babel/core @babel/preset-env webpack-cli -D
添加.babelrc:

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "targets": {
          "esmodules": true,
          "android": "4.4"
        },
        "modules": "umd",
        "corejs": "^3.6.4",
        "useBuiltIns": "usage"
      }
    ]
  ]
}

添加webpack.config.js:

const config = {
  mode: 'production',
  entry: __dirname + '/www/umi.js',
  devtool: 'cheap-module-source-map',
  output: {
    path: __dirname + '/www',
    filename: 'umi.js',
    library: 'umi.js',
    libraryTarget: 'umd',
    umdNamedDefine: true,
    globalObject: "typeof self !== 'undefined' ? self : this"
  },
  module: {
    rules: [
      {
        test: /(\.jsx|\.js)$/,
        loader: 'babel-loader',
        exclude: /(node_modules|bower_components)/
      }
    ]
  }
};

module.exports = config;