目标:编写TypeScript时,保存即生成js文件。
 
使用npm安装以下组件
  • gulp
  • gulp-rename
  • through-gulp
  • gulp-typescript
 
编写gulpfiles.js
 
var gulp = require("gulp");
var rename = require("gulp-rename");
var through = require("through-gulp");
var ts = require("gulp-typescript");
var gutil = require("gulp-util");
var fs = require("fs");
var path = require("path");
 
var taskFun = function (cb, filename)
{
    gulp.src(filename ? filename : ["**/*.ts", "!**/node_modules/**"])
        .pipe(through(function (file, encoding, callback)
        {
            gutil.log("[ts2js] " + file.path);
            this.push(file);
            callback();
        }))
        .pipe(ts())
        .pipe(rename(function (path)
        {
            path.ext = ".js";
        }))
        .pipe(gulp.dest(filename ? path.dirname(filename) : "."));
};
 
gulp.task("default", taskFun);
 
gulp.watch(["**/*.ts", "!**/node_modules/**"], function (e)
{
    if (fs.existsSync(e.path))
    {
        var stat = fs.statSync(e.path);
        if (stat.isFile())
            taskFun(null, e.path);
    }
});
 
 
执行脚本时把所有的*.ts文件生成一次,然后检测到有修改时生成对应的js。
只是当前gaze的Bug还比较多,在使用中经常掉链子,而gulp.watch()依赖此库,只能发现挂掉就重新运行下gulp。
 
 
 

使用gulp脚本配合TypeScript开发的更多相关文章

  1. gulp自己主动化任务脚本在HybridApp开发中的使用

    眼下做前端开发的同学可能都熟悉grunt.fis之类的自己主动化构建工具.事实上在HybridApp开发中我们也能够使用这些工具来简化我们的工作.gulp就是一个比grunt,fis都先进的构建工具. ...

  2. VSCode搭建node + typescript开发环境

    我们一起来喜欢TypeScript 现在写js不用TypeScript,伦家可能会觉得你是外星人. 是的,TypeScript很大程度增强了代码的可读性,可跟踪性,可维护性和减少了bug. 那么没有理 ...

  3. 使用Visual Studio Code搭建TypeScript开发环境

    使用Visual Studio Code搭建TypeScript开发环境 1.TypeScript是干什么的 ? TypeScript是由微软Anders Hejlsberg(安德斯·海尔斯伯格,也是 ...

  4. 使用TypeScript开发一个在线记事本,支持离线存储

    先贴上源码传送门: https://github.com/flowforever/yaryin.note 记事本网址: http://yindoc.com , 井号后面写你喜欢的文件名即可. 最近在研 ...

  5. TypeScript开发环境搭建(Visual studio code)

    使用Visual Studio Code搭建TypeScript开发环境 1.TypeScript是干什么的 ? TypeScript是由微软Anders Hejlsberg(安德斯·海尔斯伯格,也是 ...

  6. 使用Visual Studio Code + Node.js搭建TypeScript开发环境

    Visual Studio Code搭建Typescript开发环境 —— 相关文章: http://www.cnblogs.com/sunjie9606/p/5945540.html [注意:这里仅 ...

  7. 新石器时代码农的Typescript开发总结

    如果评定前端在最近五年的重大突破,Typescript肯定能名列其中,重大到各大技术论坛.大厂面试都认为Typescript应当是前端的一项必会技能.作为一名消息闭塞到被同事调侃成"新石器时 ...

  8. Typescript开发学习总结(附大量代码)

    如果评定前端在最近五年的重大突破,Typescript肯定能名列其中,重大到各大技术论坛.大厂面试都认为Typescript应当是前端的一项必会技能.作为一名消息闭塞到被同事调侃成"新石器时 ...

  9. 如何用TypeScript开发微信小程序

    微信小程序来了!这个号称干掉传统app的玩意儿虽然目前处于内测阶段,不过目前在应用号的官方文档里已经放出了没有内测号也能使用的模拟器了. 工具和文档可以参考官方文档:https://mp.weixin ...

随机推荐

  1. PostgreSQL的 initdb 源代码分析之八

    继续分析 由于 我并未进行特殊的参数设置,所以 (strlen(default_text_search_config) == 0) 成立. 故 调用   default_text_search_con ...

  2. Oracle DataGuard搭建(二)

    三.配置备库 创建catalog数据库 用dbca创建数据库,用oracle自带模板,不用em,启用归档,同一管理密码oracle,global name:dbcat1.node249.gewara, ...

  3. 瑞丽的SQL-基于窗体的排名计算

    在SQL Server中,窗体被定义为用户指定的一组行. 之所以要提出窗体这个概念,由于这种基于窗体或分区的又一次计算在实际工作应用范围比較广泛.比如.假设我们要对每一个班级中的学生按成绩进行排序,在 ...

  4. java搭建finagle(1)

    1.新建maven项目 2.pom文件添加依赖 添加3个主要依赖<dependency> <groupId>com.twitter</groupId> <ar ...

  5. Codeforces Round #327 (Div. 2) B. Rebranding 水题

    B. Rebranding Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/591/problem ...

  6. Codeforces Gym 100571A A. Cursed Query 离线

    A. Cursed QueryTime Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/gym/100571/problem ...

  7. PHP 更高效的字符长度判断方法(转)

    今天看到有人说,在做字符串长度判断的时候,有个比strlen效率更高的方法.即: $str = ‘aaaaaa’; ) VS }) 晚上自己用例子简单测试下,情况基本属实,特此记录下.后者效率几乎是前 ...

  8. 小白日记34:kali渗透测试之Web渗透-扫描工具-Burpsuite(二)

    扫描工具-Burpsuite 公共模块 0.Spider 爬网 手动爬网 先禁用截断功能 手动将页面中点击所有连接,对提交数据的地方,都进行提交[无论内容] 自动爬网[参数设置] 指定爬网路径,否则其 ...

  9. myeclipse2014 安装maven3.3.9和mave配置本地仓库

    昨天晚上发现eclipse下一个aptana JS的编辑插件,就想装到myeclipse下,结果悲剧了,myeclipse每次启动都闪退,虽然最后解决了,但是myeclipse里面的自带插件不知少了好 ...

  10. 修改MySQL的时区

    修改MySQL的时区,涉及参数time_zone 首先需要查看mysql的当前时区,用time_zone参数 ? 1 2 3 4 5 6 7 8 9 [html] mysql> show var ...