如何使 TypeScript 与 SystemJS 一起工作？（.js 扩展名问题）

Question

我从我的 TypeScript 文件中的以下导入开始。请注意，没有 .ts 扩展名意味着我正在导入 TypeScript 模块：

import githubService from './github.service';

这被转译为：

var github_service_1 = require('./github.service');

当 SystemJS 尝试加载此模块时，它会发出以下 HTTP 命令：

GET /github.service

而不是 GET /github.service.js。这显然行不通。

如何让 TypeScript 与 SystemJS 一起工作？

这是我的 tsconfig.json 文件：

{
    "compilerOptions": {
        "target": "es5",
        "module": "commonjs",
        "outDir": "./dist",
        "declaration": false,
        "noImplicitAny": false,
        "removeComments": true,
        "noLib": false,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "sourceMap": true
    },
    "exclude": [
        "node_modules"
    ],
    "compileOnSave": false
}

我也尝试将上面的module选项更改为system（将生成的模块格式从CommonJS更改为SystemJS），我仍然遇到同样的问题。

Answer 1

在你的 tsconfig 中：

"module": "commonjs",

由于您使用的是 systemjs，因此请将您的模块格式更改为 system。

Answer 2

我认为您的问题是模块名称中缺少 js 扩展名。不久前 System.js 改变了这一点，现在为了能够在不明确指定 '.js' 的情况下解决它们，你必须在你的 index.html 中设置 System.js 选项，如下所示：

System.defaultJSExtensions = true;

更多信息：defaultJSExtensions

编辑

正如@Naresh 所指出的，defaultJSExtensions 现在已经过时了。现在看来，更好的方法是在配置中使用 packages 选项。

希望对您有所帮助。

Answer 3

在 System 2.0+ 中，您可以使用 Loader Hooks 自定义内容

https://github.com/systemjs/systemjs/blob/2.0.0/docs/hooks.md#loader-hooks

例如，要在模块解析时将 .js 文件扩展名添加到模块中，您可以覆盖 System.prototype.resolve 函数：

const origResolve = System.constructor.prototype.resolve

System.constructor.prototype.resolve = function(moduleId, ...args) {
  return origResolve.call(
    this, 
    moduleId + '.js', // add .js extension to original module id
    ...args
  )
}

请注意，这是一个非常幼稚的示例，因为您可能不想将 .js 添加到每个模块 ID，但它展示了如何控制配置。

如何使 TypeScript 与 SystemJS 一起工作？（.js 扩展名问题）

How to make TypeScript work with SystemJS? (issue with .js extension)

typescript

systemjs

typescript1.7

如何使 TypeScript 与 SystemJS 一起工作？ （.js 扩展名问题）

How to make TypeScript work with SystemJS? (issue with .js extension)

typescript

systemjs

typescript1.7

如何使 TypeScript 与 SystemJS 一起工作？（.js 扩展名问题）