Question

我想将@angular模块重命名为angular2，因为我发现它更易读，并且想要了解导入的工作方式。

所以在我尝试更改之前，(function(global) { var map = { 'app': 'app', // 'dist', '@angular': 'node_modules/@angular', /*...*/ }; var packages = { 'app': { main: 'main.js', defaultExtension: 'js' }, '@angular/common': { main: 'index.js', defaultExtension: 'js' }; /*...*/ }; var config = { map: map, packages: packages }; if (global.filterSystemConfig) { global.filterSystemConfig(config); } System.config(config); })(this);看起来像这样：

import { Component } from '@angular/core';

app-Typescript文件中的导入如下所示：

systemjs.config.js

这可以按预期工作。现在我将(function(global) { var map = { 'app': 'app', // 'dist', 'angular2': 'node_modules/@angular', /*...*/ }; var packages = { 'app': { main: 'main.js', defaultExtension: 'js' }, 'angular2/common', { main: 'index.js', defaultExtension: 'js' }; /*...*/ }; var config = { map: map, packages: packages }; if (global.filterSystemConfig) { global.filterSystemConfig(config); } System.config(config); })(this);更改为：

import { Component } from 'angular2/core';

这样我就可以像这样导入Angular2模块：

npm start

当我尝试运行<any ng-class="{'class1': condition1, 'class2': condition2}"></any>时，我现在得到以下错误：

file-where-i-import.component.ts（1,32）：错误TS2307：找不到模块＆＃39; angular2 / core＆＃39;。

为什么不能那样工作？我错过了什么？

Answer 1

问题是SystemJS配置仅适用于运行时。

TypeScript编译依赖于d.ts文件的模块，类型，...以及此配置。编译器将查看@angular下的node_modules文件夹以解析模块，因此Angular2的模块名称必须以@angular/前缀开头。

Answer 2

如果你对@angular有这么多问题请不要使用它..开玩笑.. 你可以在下面试试，

创建一个名为angular2的新文件，其中包含以下内容，

export * from "@angular/core";

当您推荐时，您可以使用

import { Component } from 'path to angular2 module';

现在它并不完全是您想要的，因为您必须使用引用路径而不是模块名称。此外，您必须包含您可能想要使用的角度的所有模块。您也可以使用Component等导出名称过滤和公开您可能想要的内容，同时您还有机会添加模块和角度模块。

如果您想了解更多关于模块分辨率如何在Typescript中工作的信息，您可以查看Typescript Module Resolution

更新您可能有如下文件夹结构（摘自Typescript Module Resolution），

   /root/src/angular2/package.json (if it specifies a "typings" property)
   /root/src/angular2/index.ts
   /root/src/angular2/index.d.ts

然后你可以使用

   import { Component } from 'angular2';

希望这会有所帮助!!

Answer 3

您可以在 tsconfig.json 中为此指定path mapping：

"compilerOptions": {
    // ...omitted other options...
    "baseUrl": "",
    "paths": {
        "angular2/*": [
            "node_modules/@angular/*"
        ]
    }
}

此功能适用于TypeScript 2.0，但您今天可以使用它：npm install typescript@next

重命名Angular2导入模块

3 个答案: