[TypeScript] 建置输出单一JavaScript档案(.js)与Declaration档案(.d.ts)
2015-06-11 13:35
691 查看
[TypeScript] 建置输出单一JavaScript档案(.js)与Declaration档案(.d.ts)
问题情景
开发人员使用Visual Studio来开发TypeScript,可以很方便快速的将项目里的所有TypeScript档案(.ts),一口气全部编译成为JavaScript档案(.js),用以提供html网页使用。但是当软件项目越来越庞大的时候,过多的.js档引用,会增加开发.html档案时的负担;并且每个.js档之间的相依关系,也很容易因为引用顺序的错误,而造成不可预期的问题。<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>TypeScript HTML App</title> <!--Validation--> <script type="text/javascript" src="Validation/Validation.js"></script> <script type="text/javascript" src="Validation/LettersOnlyValidator.js"></script> <script type="text/javascript" src="Validation/ZipCodeValidator.js"></script> </head> <body> </body> </html>
解决方案:建置输出单一JavaScript档案(.js)
为了解决多个.js档引用所造成的问题,Visual Studio在TypeScript建置设定页面,提供了「Combine JavaScript output into file」 这个建置输出设定。开发人员只要勾选这个设定,后续在项目通过编译时,Visual Studio就会自动将项目里生成的所有.js内容,合并成为单一.js档来输出,让其他HTML开发人员方便使用。<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>TypeScript HTML App</title> <link rel="stylesheet" href="app.css" type="text/css" /> <!--Validation--> <script type="text/javascript" src="validationLibrary.js"></script> </head> <body> </body> </html>
解决方案:建置输出单一Declaration档案(.d.ts)
勾选了「Combine JavaScript output into file」 这个建置输出设定后,开发人员就可以将项目里的.ts输出成为单一.js档,提供给其他开发人员使用。这时如果其他开发人员期望能用TypeScript语法来进行后续开发,我们除了直接提供.ts源文件这个选项之外,也可以选择提供项目输出的单一.js档、加上对应的Declaration档案(.d.ts)这样的方式,来提供给其他开发人员使用。在Visual Studio里要建立项目输出的.d.ts档,开发人员可以在TypeScript建置设定页面中,勾选「Generate declaration files」这个建置输出设定。后续在项目通过编译时,Visual Studio就会自动为项目里输出的.js档、建立对应的.d.ts档,方便开发人员提供给其他TypeScript开发人员使用。
相关文章推荐
- ExtJs自学教程(1):从一切API开始
- html5media.js让所有浏览器支持video标签
- 通过Anuglar Material串串学客户端开发 - javascript编译和gulpfile.js
- JavaScript中的setUTCDate()方法使用详解
- 重新介绍 JavaScript
- 详解JavaScript中setSeconds()方法的使用
- JavaScript中setMonth()方法的使用详解
- javaScript 关于闭包问题
- 在JavaScript中处理时间之setMinutes()方法的使用
- JavaScript捕获window窗口关闭事件
- JS打印
- JavaScript中的setMilliseconds()方法使用详解
- JavaScript中变量的类型
- js如何判断是否在iframe中及防止网页被别站用 iframe嵌套 (Load denied by X-Frame-Options)
- javascript 常见功能汇总
- jsp中一些内置对象的知识
- 简介JavaScript中的setHours()方法的使用
- JavaScript中setFullYear()方法的使用详解
- javascript:内置对象 常用函数
- 一些JavaScript题目