commonjs 模块使用 async 语法错误
Opened this issue · 2 comments
问题描述
我照着文档中的快速入门新创建了一个项目,然后尝试导入一个第三方npm包(umd打包方式)试用一下,结果构建的时候就报这个错误:
export 'Core' was not found in '../../../lib/demo
经仔细检查,发现好像是这个包里面包含了一个async方法。我手动找到这个async方法注释到就能构建成功了,
因为这个包比较大,不好展示,所以我创建了一个最简单的umd包,导出几个对象,然后在某个地方写一个async方法,尝试一下引用这个包,结果也出现了同样的构建错误。
我创建了一个仓库,用来重现这个错误,仓库地址:https://github.com/fenyiwudian/demo-app
这个仓库就是按快速入门文档创建的。
克隆下这个仓库后,安装依赖,然后启动项目
git clone git@github.com:fenyiwudian/demo-app.git
yarn
yarn dev wechat
就会出现构建错误,
然后找到lib/demo.js
这个包,到最后几行,有一个注释,把注释下面的async方法注释掉,则能成功构建。
我现在的疑问是:
- 为什么async方法会导致这个构建错误,我之前在普通的react项目中同样也是用webpack构建的同样的依赖包则没有出现这个错误。
- 我该如何解决这个问题
这个我第一想到的就是用babel把依赖包中的async处理成Promise,但是我不懂出错的本质诱因,所以可能其他原因也会导致这个错误。这不是根本的解决办法。
示例代码
如上
其他信息
无
原因是 async
语法会被 babel 转换成 regenerator-runtime
处理。
remax 会自动对 global 变量 regeneratorRuntime
添加
import regeneratorRuntime from 'regenerator-runtime'
这样 umd
的导出就失效了
可以直接用 webpack.ProvidePlugin
注入 regenerator-runtime,但是发现使用 ProvidePlugin 后跟 react devtools 有冲突,需要研究一下。