前端自动化之ts编译

gulp引用包:gulp-tsc

gulpfiles.js代码:

var typescript = require('gulp-tsc');

gulp.task('compile', function () {
return gulp.src(['src/ts/*.ts'])
.pipe(typescript({
target: 'es5',//把typescript转换成es5标准的js文件,也可以是es6,但这个node版本不支持
module: 'commonjs'
}))
.pipe(gulp.dest('dist/js/ts/'))
});

然后在serve中监控ts代码的改变并编译

前端自动化之ts编译的更多相关文章

  1. 构建一个基本的前端自动化开发环境 —— 基于 Gulp 的前端集成解决方案(四)

    通过前面几节的准备工作,对于 npm / node / gulp 应该已经有了基本的认识,本节主要介绍如何构建一个基本的前端自动化开发环境. 下面将逐步构建一个可以自动编译 sass 文件.压缩 ja ...

  2. 前端自动化工具gulp自动添加版本号

    之前,我介绍了学习安装并配置前端自动化工具Gulp,觉得gulp确实比grunt的配置简单很多,于是我决定再深入学习一下gulp,就去网上查了资料,发现gulp还可以自动添加版本号,这个功能就为我平时 ...

  3. 学习安装并配置前端自动化工具Gulp

    Gulp和所有Gulp插件都是基于nodeJs来运行的,因此在你的电脑上需要安装nodeJs,安装过程请移驾安装并配置前端自动化工具--grunt.安装完成后,通过运行cmd进入DOS命令窗口,如图: ...

  4. 前端自动化构建工具gulp的使用总结

    前端自动化构建工具gulp的使用总结 博主最近偶的空闲,在此对gulp的使用做一个总结,让小伙伴知道如何合理的使用gulp以及gulp的使用技巧. 谈到gulp,有人可能就会想到另外一个构建工具gru ...

  5. 前端自动化开发之grunt

    上篇文章介绍了前端模块化开发工具seaJs,利用seaJs我们可以轻松实现前端的模块化编程,参见http://www.cnblogs.com/luozhihao/p/4818782.html 那么今天 ...

  6. 近期总结:generator-web,前端自动化构建的解决方案

    本文结合最近的工作经验,总结出一个较简洁的前端自动化构建方案,主张css和js的模块化,并通过grunt的自动化构建,有效地解决css合并,js合并和图片优化等问题,对于提高前端性能和项目代码质量有一 ...

  7. Node.js前端自动化工具:gulp

    前端自动化工具 -- gulp 使用简介 gulp是基于流的前端自动化构建工具. 之前也谈到了 grunt的用法,grunt其实就是配置+配置的形式. 而gulp呢,是基于stream流的形式,也就是 ...

  8. 前端自动化工具 -- Gulp 使用简介

    gulp是基于流的前端自动化构建工具. 之前也谈到了 grunt的用法,grunt其实就是配置+配置的形式. 而gulp呢,是基于stream流的形式,也就是前一个函数(工厂)制造出结果,提供后者使用 ...

  9. 前端自动化神器LiveReload配合浏览器和less/sass使用方法

    前言:搜了半天,各种推荐,什么十大工具啦.优秀工具集合啦之类的咸淡文章,就是没有一个讲怎么弄的.配合官网的article自己研究了半天总算配置好了.顺便吐槽下官网关于sass/less设置这块说的模糊 ...

随机推荐

  1. Python之virtualenv沙盒环境

    在开发Python应用程序的时候,系统安装的Python3只有一个版本:3.4.所有第三方的包都会被pip安装到Python3的site-packages目录下. 如果我们要同时开发多个应用程序,那这 ...

  2. [转载]java合并word文件

    需求背景 在互联网教育行业,做内容相关的项目经常碰到的一个问题就是如何动态生成一张word试卷.事先把题库中的每一道试题都已经保存成一个独立的word文件了,但是在选择了部分试题生成一张word试卷的 ...

  3. 条款20:在传递对象的时候尽量用reference-to-constent来代替,pass-by-value

    注意一下,c++的底层编译器而言,引用类型往往都是由指针来实现出来的,所以pass-by-reference实际意义上往往是传递了一个指针,这对于c++的内置类型来说往往传递一个reference更加 ...

  4. 条款11:记得在operator=中处理自赋值的情况。

    本来的版本是这样的: Widget & Widget::operator=(Widget rhs) { delete pb;//这里可能直接将rhs的pb删除了 pb = new (*rhs. ...

  5. 解析XML文件的几种方式及其比较

    解析xml文件目前比较流行的主要有四种方式: 1. DOM(Document Object Model)它把整个XML文档当成一个对象加载到内  存,不管文档有多大.它一般处理小文件 2.SAX(Si ...

  6. Android平台下渗透测试工具大集合

    Android平台下渗透测试工具大集合 分享一个google的项目,各种Android下的渗透测试工具. Ad Network Detector (1.2): http://market.androi ...

  7. 余弦相似性计算及python代码实现

    A:西米喜欢健身 B:超超不爱健身,喜欢打游戏 step1:分词 A:西米/喜欢/健身 B:超超/不/喜欢/健身,喜欢/打/游戏 step2:列出两个句子的并集 西米/喜欢/健身/超超/不/打/游戏 ...

  8. 21天学通C++_Day2

    继续学习,今天满课,相对学习内容较少,下面罗列内容: 0.常量 ▪字面常量: ▪使用关键字const声明的常量,const double Pi = 22.0/7; //后面有分号,跟定义变量一样 ▪使 ...

  9. dynamic_caast操作符

    dynamic_caast操作符,将基类的指针或引用安全的转换为派生类的指针或引用. 原理: 将一个基类对象指针或引用抛到继承类指针,dynamic_cast会根据基类指针是否真正指向继承类指针来做相 ...

  10. CSS命名规范参考及书写注意事项

    CSS书写顺序 *{ /*显示属性*/ display position float clear cursor … /*盒模型*/ margin padding width height /*排版*/ ...