Angular2 开发者的 TypeScript 配置

前端之家收集整理的这篇文章主要介绍了Angular2 开发者的 TypeScript 配置前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

TypeScript 是 Angular 应用开发中使用的主语言。 它是 JavaScript 的“方言”之一,为类型安全和工具化而做了设计期支持

浏览器不能直接执行 TypeScript 。它得先用tsc编译器转译 (transpile) 成 JavaScript ,而且编译器需要进行一些配置。

页面会覆盖 TypeScript 配置与环境的某些方面,这些对 Angular 开发者是很重要的。具体来说包括下列文件

tsconfig.json

我们通常会往项目中加入一个 TypeScript 配置文件 (tsconfig.json) ,来指导编译器如何生成 JavaScript 文件

{ "compilerOptions":  "target" "es5", "module" "commonjs" "moduleResolution" "node" "sourceMap" true "emitDecoratorMetadata" "experimentalDecorators" "removeComments"false "noImplicitAny"false}}

文件中的选项和标志是写 Angular 应用程序的基础。

noImplicitAny与suppressImplicitAnyIndexErrors

TypeScript 开发者们在标志应该是还是上存在分歧。 这没有标准答案,我们以后还可以修改这个标志。 但是我们的选择会在大项目中产生显著差异,所以它值得讨论一番。

当标志是( 默认值 ) 时, 如果编译器无法根据变量的用途推断出变量的类型,它就会悄悄的把变量类型默认为。这就是隐式的含义。

我们在“快速起步”中把标志初始化为,这是为了让学习 TypeScript 开发更简单点。

当标志是并且 TypeScript 编译器无法推断出类型时,它仍然会生成 JavaScript 文件。 但是它也会报告一个错误。 很多饱经沧桑的程序员更喜欢这种严格的设置,因为类型检查能在编译期间捕获更多意外错误

即使标志被设置成了,你也可以把变量的类型设置为。

如果我们把标志设置为了,我们可能会得到隐式索引错。 大多数程序员可能觉得这种错误是个烦恼而不是助力。 我们可以使用另一个标志来禁止它们。


 
 

TypeScript 类型定义 (typings)

很多 JavaScript 库,比如 jQuery 、 Jasmine 测试库和 Angular ,会通过新的特性和语法来扩展 JavaScript 环境。 而 TypeScript 编译器并不能原生的识别它们。 当编译器不能识别时,它就会抛出一个错误

我们可以使用TypeScript 类型定义文件——文件——来告诉编译器要加载的库的类型定义。

TypeScript 敏感的编辑器借助这些定义文件显示这些库中各个特性的类型定义。

很多库在自己的 npm 包中都包含了它们的类型定义文件, TypeScript 编译器和编辑器都能找到它们。 Angular 库也是这样的。 任何 Angular 应用程序的目录下,都包含几个文件,它们描述了 Angular 的各个部分。

我们不需要为那些包含了文件的库获取类型定义文件—— Angular 的所有包都是如此。

安装类型定义文件

遗憾的是,很多库—— jQuery 、 Jasmine 和 Lodash 等库——都没有在它们自己的 npm 包中包含文件。 幸运的是,它们的作者或社区中的贡献者已经为这些库创建了独立的文件,并且把它们发布到了一个众所周知的位置。

We can install these typings viausing thescoped packageand Typescript (starting at 2.0) will automatically recognize them.

For instance,to install typings forwe could do.

我们在“快速起步”中指定过三个类型定义文件():

  • core-js是为 ES5 浏览器添加 ES2015/ES6 特性的类型定义

  • jasmine是 Jasmine 测试框架的类型定义

  • node是为了在nodejs环境中引用对象的代码提供的类型定义。 在webpack页面可以看到例子。

noImplicitAnytruefalsenoImplicitAnyfalseanyanynoImplicitAnyfalsenoImplicitAnytruenoImplicitAnytrueanynoImplicitAnytrue"suppressImplicitAnyIndexErrors":true .d.tsnode_modules/@angular/core/d.tsd.tsd.tsd.tsnpm@types/*jasminenpm install @types/jasmine --save-devd.ts

猜你在找的Angularjs相关文章