获取Angular 2 .ts文件而不是.d.ts文件 [英] Get Angular 2 .ts files instead of .d.ts files

问题描述

当我使用angular2代码时，我经常需要查看类的实现，比如说Router类.

When I work with angular2 code I often need to see the implementation of a class, let's say the Router class.

如果在我的IDE WebStorm中单击Router类型，请执行e. G.在另一个类的构造函数中

If I click on the Router type in my IDE WebStorm, e. g. inside the constructor of another class

export class myClass {
    constructor(private router: Router) {}
    // ...
}

我的IDE将我带到node_modules文件夹中的TypeScript定义文件router.d.ts.我想要的是将我带到带有路由器类的实现的原始router.ts文件，而不仅仅是其定义.

my IDE takes me to the TypeScript definition file router.d.ts inside my node_modules folder. What I want is it to take me to the original router.ts file with the implementation of the router class, not just its definition.

当您通过官方github中查找原始代码回购.

The original .ts file is not included in the node_modules folder structure when you get angular2 from github via the standard package.json suggested in the Angular2 Quickstart. Currently, I have to look up the original code in the official github repo.

有什么想法如何将.ts文件而不是.d.ts文件放入我的node_modules/@angular文件夹?

Any ideas how to get the .ts files into my node_modules/@angular folder instead of the .d.ts files?

推荐答案

遗憾的是，由于不存在TS文件，因此无法实现.即使添加它们，由于导入始终指向定义文件的真实角度路径，仍然是不可能的.最重要的是，项目的文件结构与导入字符串文字的结构不相关.

Sadly, it's not possible since no TS files exist. Even if you add them it still not possible since you import real angular paths which always point to the definition files. On top of that the file structure of the project does not correlate to the structure of the import string literals.

NPM软件包不包含.ts文件，这是由角度小组设计的.直到不久前，.ts文件的确与NPM软件包一起提供.

The NPM package does not include .ts files, this is by design from the angular team. Up until some time ago the .ts files were indeed supplied with the NPM package.

删除它们的原因是禁止用户访问私有类以及@internal和私有API的滥用，私有类是API中的公共方法/属性，不应被认为是公共的，但必须是公共的，以便其他有角内部类可以使用他们.

The reasoning for removing them is to disable abuse from users accessing private classes and @internal and private APIs which is public methods/properties in the API that are not supposed to be public but must be so other angular internal classes can use them.

我们以前经常看到很多代码示例，这些代码示例执行import { PromiseCompleter } from 'angular2/src/facade/lang';(在RC0之前)，但是当项目结构在RC0中具有较大的结构重构时，这种情况就改变了.这种滥用非常广泛，这很糟糕，非常糟糕……对于用户和Angular PR.

We used to see a lot of code samples out there doing things like import { PromiseCompleter } from 'angular2/src/facade/lang'; (before RC0) but this was changed when the project structure had a big structure refactor in RC0. This abuse was wide and it's bad, very bad... For users and for Angular PR.

Angular项目具有复杂而强大的构建过程，其中所有API都使用自动过程限制了公开范围，从而将所有API从.ts文件移动到了d.ts文件. ( public_api_guard )

The Angular project has a complex and robust build process where all of the API is moved from .ts files into d.ts files using an automated process that limits exposure. (public_api_guard)

最终结果仅是d.ts个文件.

也无法克隆git repo并使用它，因为同样，文件结构与众不同，因此导入必须更改.最重要的是，如果没有构建，Angular很可能无法正常工作.

It's also not possible to clone the git repo and use it since, again, the file structure is way way different so imports will have to change. Most importantly without the build Angular will, most likely, not work.

但是，如果调试应用程序，则会注意到您在控制台的源视图中到达了实际的角铁芯.ts文件，这是因为NPM软件包随附了包含完整TS源代码的源映射文件.他们在那里做的好戏.

However, if you debug your app you notice that you reach actual angular core .ts files in the source view of the console, this is because the NPM package comes with source map files that include the whole TS source code. Nice trick they did there.

这是我用来深入挖掘角度的方法，它的效果非常好，并且我从中受益匪浅. 它不像Goto Declaration那样好，但是有点... IMO，当您逐步执行代码时也更容易理解...

This is what I use to dig deep into angular, it works quite great and I get a lot from it. It's not as nice as Goto Declaration but it something... IMO it's also easier to understand when you step through code...

这篇关于获取Angular 2 .ts文件而不是.d.ts文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！