Question

我知道有一些进展或至少计划（#5093，#5728）来改进typescript的模块路径映射，但我想知道目前我们的选择是什么（Angular2 beta.1，TypeScript 1.7，VS Code 0.10.5，nodejs 5.4，systemjs 0.19）。

为了让所有人开心（编译器，编辑器和浏览器），我使用以下语法导入模块：

// C:/~somepath~/project_name/src/scripts/app/components/search/search.component.ts
import {Component} from 'angular2/core';
import {EmitterService} from '../../../core/services/emitter/emitter.service';
import {SearchService} from '../../../app/services/search/search.service';

编译为

System.register(['angular2/core', '../../../core/services/emitter/emitter.service'], function(exports_1) {

当我使用以下选项时

// tsconfig.json
{
  "compilerOptions": {
    "target": "ES5",
    "module": "system",
    "moduleResolution": "node"
    ...
  }  
}

我想使用没有所有这些点的导入：

import {EmitterService} from 'core/services/emitter/emitter.service';

因为它变得非常难看，追踪疯狂，以及移动模块的噩梦。由于systemjs配置，它在浏览器中工作：

// system.conf.js
System.config({
  map: {
    app: "/scripts/app",
    core: "/scripts/core",
  }
}

我可以通过向tsconfig.json添加"isolatedModules": true来“欺骗”编译器（如果没有这会引发错误），但在Visual Studio Code中Cannot find module错误仍然存在且我丢失了代码-hinting。我听说在node_modules文件夹中有一些带有打字的解决方案，但是找不到任何有用的例子。

任何人都知道如何配置所有这些以优雅地协同工作？

感谢。

Answer 1

为了跟进未来的访问者，这应该在TypeScript 2.0中修复。您正在寻找的配置是在baseUrl中设置paths或tsconfig.json属性。如果您无条件地希望将所有内容与scripts中的某个路径匹配，请使用以下内容：

{
    "baseUrl": "./src/scripts"
}

如果您只想特别使用core和app，请使用

{
    "baseUrl": "./src/scripts",
    "paths": {
        "app/*": ["app/*"],
        "core/*": ["core/*"]
    }
}

在Angular2（TS）中导入模块的选项

任何人都知道如何配置所有这些以优雅地协同工作？

1 个答案: