使用不超过 npm 的 babelify 转译异步函数

Transpile async functions using babelify with no more than npm

我正在尝试使用 Babelify 来转换异步和等待 ES7 功能,但我不想使用 gulp、grunt 或类似的构建工具。到目前为止,我仅使用 npm 就取得了巨大的成功,这一个额外的步骤似乎不值得采用更复杂的构建工具链。

这是我的最小 package.json 文件,只要我不使用它就可以工作 async/await:

{
  "main": "main.js",
  "scripts": {
    "compile": "browserify . --outfile bundle.js"
  },
  "browserify": {
    "transform": [
      [
        "babelify",
        {
          "optional": [
            "es7.asyncFunctions"
          ]
        }
      ]
    ]
  },
  "devDependencies": {
    "babelify": "^6.2.0",
    "browserify": "^11.0.1"
  }
}

这是我尝试转译的少量代码 (main.js):

import "babelify/polyfill";

let asPromised = await fetch();
console.log(asPromised);

function fetch() {
  return Promise.resolve("fetched");
}

这是我执行 npm run compile:

时的不幸结果
> @ compile ~/project
> browserify . --outfile bundle.js

SyntaxError: ~/project/main.js: Unexpected token (3:23)
  1 | import "babelify/polyfill";
  2 | 
> 3 | let asPromised = await fetch();
    |                        ^
  4 | console.log(asPromised);
  5 | 
  6 | function fetch() {
    at Parser.pp.raise (~/project/node_modules/babelify/node_modules/babel-core/node_modules/babylon/lib/parser/location.js:24:13)
    at Parser.pp.unexpected (~/project/node_modules/babelify/node_modules/babel-core/node_modules/babylon/lib/parser/util.js:82:8)
    at Parser.pp.semicolon (~/project/node_modules/babelify/node_modules/babel-core/node_modules/babylon/lib/parser/util.js:69:81)
    at Parser.pp.parseVarStatement (~/project/node_modules/babelify/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:371:8)
    at Parser.pp.parseStatement (~/project/node_modules/babelify/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:99:19)
    at Parser.parseStatement (~/project/node_modules/babelify/node_modules/babel-core/node_modules/babylon/lib/plugins/flow.js:621:22)
    at Parser.pp.parseTopLevel (~/project/node_modules/babelify/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:30:21)
    at Parser.parse (~/project/node_modules/babelify/node_modules/babel-core/node_modules/babylon/lib/parser/index.js:70:17)
    at Object.parse (~/project/node_modules/babelify/node_modules/babel-core/node_modules/babylon/lib/index.js:45:50)
    at Object.exports.default (~/project/node_modules/babelify/node_modules/babel-core/lib/helpers/parse.js:36:18)

npm ERR! @ compile: `browserify . --outfile bundle.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the @ compile script.
npm ERR! This is most likely a problem with the  package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     browserify . --outfile bundle.js
npm ERR! You can get their info via:
npm ERR!     npm owner ls 
npm ERR! There is likely additional logging output above.
npm ERR! System Linux 4.0.2-stable
npm ERR! command "/usr/bin/node" "/usr/bin/npm" "run" "compile"
npm ERR! cwd ~/project
npm ERR! node -v v0.10.30
npm ERR! npm -v 1.4.21
npm ERR! code ELIFECYCLE
npm ERR! 
npm ERR! Additional logging details can be found in:
npm ERR!     ~/project/npm-debug.log
npm ERR! not ok code 0

(变态:https://gist.github.com/au-phiware/34376f64f9ea6777eefd

我也从命令行尝试了以下,它们都给出了相同的错误:

browserify . --outfile bundle.js -t [ babelify --optional es7.asyncFunctions ]
babel --out-file bundle.js --optional es7.asyncFunctions main.js
babel --out-file bundle.js --stage 2 main.js

我觉得我好像在这里遗漏了一些东西...或者这可能是 Babel 错误? TIA.

I feel as if I'm missing something here...

您只能在await async 函数中使用。例如:

async function foo() {
   return await bar();
}
foo().then(x => console.log(x));

在顶层你总是必须直接处理承诺:

fetch().then(x => console.log(x));