在Angular2(TS)中导入模块的选项

Sas*_*sxa 7 typescript systemjs visual-studio-code angular

我知道有一些进展或至少计划(#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';
Run Code Online (Sandbox Code Playgroud)

编译成

System.register(['angular2/core', '../../../core/services/emitter/emitter.service'], function(exports_1) {
Run Code Online (Sandbox Code Playgroud)

当我使用以下选项时

// tsconfig.json
{
  "compilerOptions": {
    "target": "ES5",
    "module": "system",
    "moduleResolution": "node"
    ...
  }  
}
Run Code Online (Sandbox Code Playgroud)

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

import {EmitterService} from 'core/services/emitter/emitter.service';
Run Code Online (Sandbox Code Playgroud)

因为它变得非常丑陋,疯狂跟踪和噩梦移动模块.由于systemjs配置,它在浏览器中工作:

// system.conf.js
System.config({
  map: {
    app: "/scripts/app",
    core: "/scripts/core",
  }
}
Run Code Online (Sandbox Code Playgroud)

我可以"欺骗"通过将编译器"isolatedModules": true来tsconfig.json(没有这个它抛出一个错误),但在Visual Studio CodeCannot find module错误仍然存在,我失去了代码提示.我听说node_modules文件夹中有一些打字的解决方案,但是找不到任何有用的例子.

任何人都知道一种方法来配置所有这些优雅地协同工作?

谢谢.

Dan*_*ser 0

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

{
    "baseUrl": "./src/scripts"
}
Run Code Online (Sandbox Code Playgroud)

如果它只是core并且app您想专门使用,请使用

{
    "baseUrl": "./src/scripts",
    "paths": {
        "app/*": ["app/*"],
        "core/*": ["core/*"]
    }
}
Run Code Online (Sandbox Code Playgroud)