zl程序教程

您现在的位置是:首页 >  前端

当前栏目

[TypeScript] Using Gulp with TypeScript

typescript with Using Gulp
2023-09-14 08:59:20 时间

Package.json:

{
  "name": "typescript",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "dependencies": {
    "gulp": "^3.9.0",
    "gulp-typescript": "^2.8.0"
  },
  "devDependencies": {
    "del": "^1.2.1",
    "gulp-concat": "^2.6.0",
    "gulp-plumber": "^1.0.1",
    "gulp-uglify": "^1.2.0",
    "run-sequence": "^1.1.2"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

 

Use:

gulpfile.js

/**
 * Created by Answer1215 on 8/17/2015.
 */
var gulp = require('gulp'),
    plumber = require('gulp-plumber'),
    uglify = require('gulp-uglify'),
    concat = require('gulp-concat'),
    ts = require('gulp-typescript'),
    runSequence = require('run-sequence'),
    del = require('del'),
    tsPath = 'typescript/*.ts',
    jsPath = './js',
    compilePath = 'js/compiled',
    dist = 'js/dist';

gulp.task('build', function(callback) {
    runSequence('clean', ['typescript','compressScripts'], callback);
});

gulp.task('compressScripts', function() {
    gulp.src([
        compilePath + 'typescript/*.js'
    ])
        .pipe(plumber())
        .pipe(concat('bundle.min.js'))
        .pipe(uglify())
        .pipe(gulp.dest(dist));
});

gulp.task('typescript', function() {
    var tsResult = gulp.src(tsPath)
        .pipe(ts({
            target: 'ES5',
            noExternalResolve: true,
            declarationFiles: false
        }));

    tsResult.dts.pipe(gulp.dest(compilePath + '/tsdefinitions'));
    return tsResult.js.pipe(gulp.dest(compilePath + '/typescript'))
});

gulp.task('clean', function(callback) {
    del([jsPath], {force: true}, callback);
});

gulp.task('watch', function() {
    gulp.watch([tsPath], ['typescript']);
});

gulp.task('default', function(callback) {
    runSequence('build', ['watch'], callback);
});