在Web中运行的TypeScript中未定义regeneratorRuntime

时间:2018-07-10 09:55:50

标签: typescript vue.js parceljs

我使用Vue.js + TypeScript + Parcel进行演示,并尝试在 index.ts 中使用async/await

index.html

<html>
...
<body>
  <script src="index.ts"></script>
</body>
</html>

index.ts

console.log('Not see me')
(async () => {
  console.log('Did not execute here too.')
})()

执行parcel index.html并打开 http://localhost:1234/ 。控制台抛出错误: regeneratorRuntime未定义

index.a4a28941.js:110 Uncaught ReferenceError: regeneratorRuntime is not defined
    at index.a4a28941.js:110
    at Object.parcelRequire.306 (index.ts:3)
    at newRequire (index.a4a28941.js:48)
    at parcelRequire.306 (index.a4a28941.js:80)
    at index.a4a28941.js:106

似乎async语法需要使用polyfill?

这是我的 tsconfig.json

{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "baseUrl": ".",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "jsx": "preserve",
    "module": "esnext",
    "moduleResolution": "node",
    "noImplicitReturns": true,
    "sourceMap": true,
    "strict": true,
    "target": "esnext",
    "paths": {
      "@/*": ["src/*"]
    },
    "lib": ["esnext", "esnext.array", "dom", "dom.iterable", "scripthost", "es2015.generator"]
  },
  "parcelTsPluginOptions": {
    // If true type-checking is disabled
    "transpileOnly": false
  },
  "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue", "tests/**/*.ts", "tests/**/*.tsx"],
  "exclude": ["node_modules"]
}

1 个答案:

答案 0 :(得分:8)

我的解决方案是在target文件中将"es5"设置为tsconfig.json

{
  "compilerOptions": {
    "target": "es5"
  }
}

但是,包裹似乎总是使用babel来转换javascript,这会导致打字稿编译器发生冲突(请参见此处:https://github.com/parcel-bundler/parcel/issues/954和此处:https://github.com/parcel-bundler/parcel/issues/871) 。有些人还通过在他们的项目中要求babel-polifill来解决了这个问题,但是,如果您只想使用打字稿编译器并且没有babel进行任何转换,这似乎不是最佳选择。