使用async / await没有babel-polyfill

时间:2017-04-12 12:31:58

标签: javascript reactjs webpack async-await babeljs

我的代码如下:

  @action async login(payload){
    try {
      this.loginLoading = true
      const data = await request('/admin/login', {
        method: 'post',
        data: payload
      })
      this.logined = true
      localStorage.setItem('token', data.token)
      this.loginLoading = false
    } catch (error) {
      console.log(error)
      message.error('login failed')
      this.logined = false
      this.loginLoading = false
    }

babel-polyfill会将上面的代码转换为:

       return _regenerator2.default.wrap(function _callee$(_context) {
          while (1) {
            switch (_context.prev = _context.next) {
              case 0:
                _context.prev = 0;

                this.loginLoading = true;
                _context.next = 4;
                return (0, _request2.default)('/admin/login', {
                  method: 'post',
                  data: payload
                });

              case 4:
                data = _context.sent;

                this.logined = true;
                localStorage.setItem('token', data.token);
                this.loginLoading = false;
                _context.next = 16;
                break;

              case 10:
                _context.prev = 10;
                _context.t0 = _context['catch'](0);

                console.log(_context.t0);
                _message2.default.error('login failed');
                this.logined = false;
                this.loginLoading = false;

              case 16:
              case 'end':
                return _context.stop();
            }
          }

转换后的代码将使用源映射重命名chrome devl-tool中难以读取和调试的变量,实际上最新的chrome支持async / await语法,所以我不想在开发中使用babel-polyfill。

但如果删除babel-polyfill,则会抛出regeneratorRuntime is not defined.

1 个答案:

答案 0 :(得分:2)

  

如果您已将浏览器定位设置为chrome> = 59,那么您就是这么简单   将使用本机生成器,永远不会使用   填充工具,

https://medium.com/@zwacky/add-es7-async-await-support-into-your-non-bleeding-edge-build-process-ad0dded0d002

有趣的是:

  

如果您只需要生成器polyfill - 这是必需的   async / await - 然后你就可以使用facebook/regenerator了   无论如何,由babel-polyfill使用。