TypeScript ES 动态 `import()`

Question

在使用新的 TypeScript 功能时，即所谓的 ES Dynamic Imports，我无法使用 ts-node.[=20 运行服务器端我的同构应用程序的代码=]

使用以自己的方式转译代码的 webpack 模块加载器并运行在浏览器中生成结果文件时似乎没有发生错误。

我遇到的错误：

case 0: return [4 /*yield*/, import("./component/main")];
                             ^^^^^^
SyntaxError: Unexpected token import

通常 TypeScript 将 import 表达式转换为类似的东西：Promise.resolve(require("./component/main"))，但我在那里看不到它。

如何解决？它与 ts-node 有什么共同点吗？或者 node.js 有一个 "polyfill"?

我的 tsconfig.json 文件：

{
  "compilerOptions": {
    "declaration": false,
    "emitDecoratorMetadata": true,
    "allowJs": false,
    "experimentalDecorators": true,
    "importHelpers": true,
    "inlineSourceMap": false,
    "inlineSources": false,
    "lib": [
      "DOM",
      "ES5",
      "ES6",
      "ES7"
    ],
    "listFiles": false,
    "module": "commonjs",
    "noEmitOnError": true,
    "noImplicitAny": true,
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "preserveConstEnums": false,
    "pretty": false,
    "removeComments": false,
    "strict": true,
    "target": "es5"
  }
}

代码：

import * as m from "mithril";

import LayoutComponent from "./component/layout";

const render = (
    layout: m.ComponentTypes<any, any>,
) => ({ tag, attrs }: m.Vnode<any, any>) => m(layout, attrs, m(tag as any, attrs));

export default {
    "/:path...": {
        onmatch: async (args, path) => (await import("./component/main")).default,
        render: render(LayoutComponent),
    },
} as m.RouteDefs;

Answer 1

这是一个bug in the Typescript Compiler which will be fixed in 2.5。

使用导入文件的函数导出默认对象不会将import语句编译成require语句 在打字稿 2.4.x.

例如，虽然这样：

export const sudo = { run() { return import('./test3'); } }

将编译为：

exports.sudo = { run: function () { return Promise.resolve().then(function () { return require('./test3'); }); } };

这个：

export default { run() { return import('./test3'); } }

编译成这样：

exports.default = { run: function () { return import('./test3'); } };

这显然是错误的。临时解决方案是这样的：

export const sudo = { run() { return import('./test3'); } }

export default sudo;

编译（正确）为：

exports.sudo = { run: function () { return Promise.resolve().then(function () { return require('./test3'); }); } };
exports.default = exports.sudo;

TypeScript ES 动态 `import()`

TypeScript ES dynamic `import()`

node.js

typescript

ts-node

typescript2.4