微信插件中使用 async-await 报错

[minetsh]

Feature Request 请提到 FeatHub

Taro 使用上的问题请提到 Taro 社区——让每一次交流被沉淀

如果是提交 bug，请搜索文档和 issue，确认以下事项：

• 该问题没有在其他 issue 和文档讨论到，不属于重复内容

• 分割线以下的模板除了「 补充信息」每一样都必填

如果不满足以上两点要求的 bug 报告，issue 会被直接关掉。

请多多理解，您现在的不便将会使 Taro 开发者更高效地定位你的问题，修复你的问题。像你一样的 Taro 的使用者也可以通过搜索找到你提供的 bug，对各方都有很大好处。

🙏🙏🙏
阅读完后请在提交的issue中删除以上内容，包括分割线。

问题描述
Taro 开发微信插件如何使用 async-await ？我在 index.tsx 中 import '@tarojs/async-await';，然后再写一个 async 的方法，会始终报错：

复现步骤
[复现问题的步骤]

1. 使用 taro init 初始化一个插件包
2. 安装 async-await 包
3. 导入 async-await 包
4. 实现方法

[代码只贴截图，不贴文字会被视为无效issue]
[代码只贴截图，不贴文字会被视为无效issue]
[代码只贴截图，不贴文字会被视为无效issue]

import '@tarojs/async-await';

const s = async () => {
  console.log('call s')
}

s()

期望行为
可以正常使用 async 方法

报错信息

WAService.js:1 Uncaught ReferenceError: regeneratorRuntime is not defined
at appservice.js:1137
at appservice.js:1155
at h (WAService.js:1)
at WAService.js:1
at appservice.js:2620
at h (WAService.js:1)
at WAService.js:1
at appservice.js:14131
at f (WAService.js:1)
at t.requirePlugin (WAService.js:1)
(anonymous) @ appservice.js:1137
(anonymous) @ appservice.js:1155
h @ WAService.js:1
(anonymous) @ WAService.js:1
(anonymous) @ appservice.js:2620
h @ WAService.js:1
(anonymous) @ WAService.js:1
(anonymous) @ appservice.js:14131
f @ WAService.js:1
t.requirePlugin @ WAService.js:1
(anonymous) @ appservice.js:14135
WAService.js:1 Uncaught ReferenceError: regeneratorRuntime is not defined
at appservice.js:1137
at appservice.js:1155
at h (WAService.js:1)
at WAService.js:1
at appservice.js:2620
at h (WAService.js:1)
at WAService.js:1
at appservice.js:14131
at f (WAService.js:1)
at Object.t.requirePlugin (WAService.js:1)
(anonymous) @ appservice.js:1137
(anonymous) @ appservice.js:1155
h @ WAService.js:1
(anonymous) @ WAService.js:1
(anonymous) @ appservice.js:2620
h @ WAService.js:1
(anonymous) @ WAService.js:1
(anonymous) @ appservice.js:14131
f @ WAService.js:1
t.requirePlugin @ WAService.js:1
(anonymous) @ index.js:25
require @ WAService.js:1
(anonymous) @ VM5372:8

系统信息

Taro v1.2 及以上版本已添加 taro info 命令，方便大家查看系统及依赖信息，运行该命令后将结果贴下面即可。

👽 Taro v1.3.0-beta.6

Taro CLI 1.3.0-beta.6 environment info:
System:
OS: macOS 10.14.1
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 11.10.1 - /usr/local/bin/node
Yarn: 1.13.0 - /usr/local/bin/yarn
npm: 6.9.0 - /usr/local/bin/npm
npmPackages:
@tarojs/async-await: ^1.3.11 => 1.3.11
@tarojs/components: 1.3.10 => 1.3.10
@tarojs/mobx: 1.3.10 => 1.3.10
@tarojs/plugin-babel: 1.3.10 => 1.3.10
@tarojs/plugin-csso: 1.3.10 => 1.3.10
@tarojs/plugin-sass: 1.3.10 => 1.3.10
@tarojs/plugin-uglifyjs: 1.3.10 => 1.3.10
@tarojs/router: 1.3.10 => 1.3.10
@tarojs/taro: 1.3.10 => 1.3.10
@tarojs/taro-alipay: 1.3.10 => 1.3.10
@tarojs/taro-h5: 1.3.10 => 1.3.10
@tarojs/taro-swan: 1.3.10 => 1.3.10
@tarojs/taro-tt: 1.3.10 => 1.3.10
@tarojs/taro-weapp: 1.3.10 => 1.3.10
@tarojs/webpack-runner: 1.3.10 => 1.3.10
eslint-config-taro: 1.3.10 => 1.3.10
eslint-plugin-taro: 1.3.10 => 1.3.10
nervjs: ^1.4.0 => 1.4.1
npmGlobalPackages:
typescript: 3.2.2

• 报错平台 [weapp]

补充信息

如何在小程序插件开发中正确使用 async-await

[taro-bot]

欢迎提交 Issue~

如果你提交的是 bug 报告，请务必遵循 Issue 模板的规范，尽量用简洁的语言描述你的问题，最好能提供一个稳定简单的复现。🙏🙏🙏

如果你的信息提供过于模糊或不足，或者已经其他 issue 已经存在相关内容，你的 issue 有可能会被关闭。

Good luck and happy coding~

[luckyadam]

给一个完整复现 demo 吧

[minetsh]

给一个完整复现 demo 吧

https://github.com/minetsh/weapp-plugin-demo

在 /src/plugin/index.tsx 中引入 import '@tarojs/async-await'; 然后使用 async 方法报错。

[peica]

同上。。。

[peica]

好像用到async就会报错

[Yaphet2015]

同上 求解决

[Yaphet2015]

发现在我的代码里无论怎么补都无效
是在框架初始化的时候就需要执行这段东西
怀疑是不是小程序插件不支持async包里写的global变量的原因？

[Yaphet2015]

@luckyadam 麻烦看下

[K-walker]

臣附议

[luckyadam]

升级到最新版本试试

[K-walker]

@luckyadam 升级之后报错

请问这是框架的问题吗？

[K-walker]

经过测试，发现在小程序插件可以使用 async-await ，直接在app.tsx 中引入import '@tarojs/async-await'; 即可，同时提醒大家，plugin 文件夹中的模块，不可在其外部导入使用，否则在打包的时候，会报错，比如在 app.tsx 中引入 plugin/utils/index.js 模块,这种方式是无法使用 plugin/utils/index.js 模块的，因此 plugin 文件夹下的模块只能在此文件夹内的模块中项目引用，如果需要在外边使用，则需要将 plugin/utils/index.js模块移出 plugin 目录即可，打包后，会分别打入在 miniprogram 和 plugin 中

[Yaphet2015]

@K-walker 试了并没有用，我还在/plugin里的index.js也引了，这边有在测试的时候调用async-await相关的api试试吗
P.S. 谢谢提醒

[K-walker]

@JasonYan2015 我自己试了是可以的啊，就是在 app.tsx 中引入 async-await 就好了，要不你重新用taro-cli创建一个微信插件模板再试试吧

[K-walker]

虽然按照我上面的做法可以使用 async-await ，但是控制台还是会报错，如下：

尽管如此，好像还是可以用的，但是还有一个问题，就是我插件的首页叫 home,我跳转到其他插件页面然后使用async/await是可以的，但是如果我再 home 页面导入 http.js 文件，代码如下：
home.ts 伪代码：

import './http.js';
// 此处省略...

http.js 伪代码：

function fetchData () {
  return Promise.resolve('ok');
}

async function test () {
  const result = await fetchData();
  console.log(result);
}

test();

此时，我从小程序页面，跳转到插件的首页 home ,则打印如下错误:

然后我把 async/await 去掉之后，就又正常了，感觉 http.js 编译时，async-await 模块还未添加到全局，因此我修改了下 home.js 模块加了个延迟：

setTimeout(()=> {
require('./http.js');
},200)

通过加延迟，然后跳转就正常了，但是上面还是报 regeneratorRuntime is not defined 这个错，麻烦官方看看呢，谢谢了。
@luckyadam

[Chen-jj]

微信小程序插件不能直接访问 global 对象的属性，所以不支持 async-await，用 Promise 吧。