Question

我正在尝试使用Angular 2和Typescript来学习和创建Gulp构建过程。我跟着快速入门，一切都运转得很好。现在我试图分手并尝试做一些不同的事情。我尝试做的是使用不同的文件夹结构，我的app.component.ts文件找到import { Component } from 'node_modules/@angular/core';时遇到问题。我已将文件更改为import { Component } from '../../../manager/node_modules/@angular/core';并且它有效，但我发现其他人有不同的文件夹结构，并且他们不使用长目录路径。

目前我的文件夹结构如下：

build
  - css
  - js
  // all compiled files end up here
manager
  - node_modules
  - typings
  gulpfile.ts
  typings.json
  package.json
  tsconfig.json
source
  app.component.ts
  main.ts

app.component.ts

/// <reference path="../manager/typings/index.d.ts" />

import { Component } from '../manager/node_modules/@angular/core';
@Component({
  selector: 'my-app',
  template: '<h1>My First Angular 2 App</h1>'
})
export class AppComponent { }

我的问题是：

我可以在不写出整条路径的情况下引用@angular/core吗？
有没有办法可以省略<reference path="">？

angular2-seed项目可以做到，但我无法弄清楚他们是如何做到的。我确定他们有一个文件可以为他们提供文件参考。

Answer 1

尝试使用以下文件夹结构：

build/
  css/
  js/
source/
  app.component.ts
  main.ts
node_modules/
typings/
gulpfile.ts
typings.json
package.json
tsconfig.json

说明：您的tsconfig.json必须位于根目录中，因此TypeScript编译器将正确解析@angular/core模块。同样最好将node_modules文件夹和typings.json文件保留在根目录中。

要了解TypeScript如何解析模块，请阅读Module Resolution文档。

Angular 2 Typescript类型路径问题

1 个答案: