美文网首页
学习TypeScript时遇到的gulp编译问题

学习TypeScript时遇到的gulp编译问题

作者: 李荣喜 | 来源:发表于2019-09-25 17:32 被阅读0次

    今天给大家分享下,学习typescript时遇到的gulp编译问题,按照官网的步骤一步步坐下来,中途在编译gulp时编译不了,经过一番测试查看,修改了gulpfile.js,代码如下:

    var gulp = require("gulp");
    var browserify = require("browserify");
    var source = require("vinyl-source-stream");
    var tsify = require("tsify");
    var paths = {
        pages:["src/*.html"]
    };
    
    
    gulp.task("copy-html",function(){
        return gulp.src(paths.pages).pipe(gulp.dest("dist"));
    });
    
    //此处使用了gulp.series解决
    gulp.task("default",gulp.series(["copy-html"],function(){
        return browserify({
            basedir:'.',
            debug:true,
            entries: ['src/main.ts'],
            cache:{},
            packageCache:{}
        }).plugin(tsify).bundle().pipe(source('bundle.js')).pipe(gulp.dest('dist'));
    }));
    
    • 看了网上说的是因为gulp4和gulp3的一些区别,如果装的时gulp4使用这种就可以。
    • 可以打开cmd使用 gulp -v查看gulp 一下版本 。

    下面是官网的例子,在我电脑上运行之后报错了:

    var gulp = require("gulp");
    var browserify = require("browserify");
    var source = require('vinyl-source-stream');
    var tsify = require("tsify");
    var paths = {
        pages: ['src/*.html']
    };
    
    gulp.task("copy-html", function () {
        return gulp.src(paths.pages)
            .pipe(gulp.dest("dist"));
    });
    
    gulp.task("default", ["copy-html"], function () {
        return browserify({
            basedir: '.',
            debug: true,
            entries: ['src/main.ts'],
            cache: {},
            packageCache: {}
        })
        .plugin(tsify)
        .bundle()
        .pipe(source('bundle.js'))
        .pipe(gulp.dest("dist"));
    });
    

    运行gulp 之后报如下错误,不知到大家有没有遇到过:

    gulp_err.png

    相关文章

      网友评论

          本文标题:学习TypeScript时遇到的gulp编译问题

          本文链接:https://www.haomeiwen.com/subject/jeqysctx.html