zoukankan      html  css  js  c++  java
  • gulp 流处理

    包含的内容:

        穿插流
        流合并
        流队列
        流筛选
    1. 穿插流
    // passthrough  stream  把流传递给其他的
    
    // use
    
    gulp.src(glob,{passthrough:true})
    
    // function 
    进行流的合并处理,避免多余配置以及冗余代码
    2. 合并流
    // 使用merge2
    
    // install 
    
    yarn  add merge2  or  npm install merge2
    
    // use
    
    const gulp = require('gulp')
    const merge2 = require('merge2')
    const concat = require('gulp-concat')
    const minifyHtml = require('gulp-minify-html')
    const ngtemplate = require('gulp-ngtemplate')
     
    gulp.task('app-js', function () {
      return merge2(
          gulp.src('static/src/tpl/*.html')
            .pipe(minifyHtml({empty: true}))
            .pipe(ngtemplate({
              module: 'genTemplates',
              standalone: true
            })
          ), gulp.src([
            'static/src/js/app.js',
            'static/src/js/locale_zh-cn.js',
            'static/src/js/router.js',
            'static/src/js/tools.js',
            'static/src/js/services.js',
            'static/src/js/filters.js',
            'static/src/js/directives.js',
            'static/src/js/controllers.js'
          ])
        )
        .pipe(concat('app.js'))
        .pipe(gulp.dest('static/dist/js/'))
    })
    3. 流队列
    // 使用 streamqueue
    //use
    
    var StreamQueue = require('streamqueue');
    var queue = new StreamQueue();
    queue.queue(
     gulp.src('static/src/tpl/*.html')
            .pipe(minifyHtml({empty: true}))
            .pipe(ngtemplate({
              module: 'genTemplates',
              standalone: true
            })
          ), gulp.src([
            'static/src/js/app.js',
            'static/src/js/locale_zh-cn.js',
            'static/src/js/router.js',
            'static/src/js/tools.js',
            'static/src/js/services.js',
            'static/src/js/filters.js',
            'static/src/js/directives.js',
            'static/src/js/controllers.js'
          ])
    );
    queue.pipe(process.stdout);
    4. 流修改
    // 使用 gulp-filter
    
    // use
    
    const gulp = require('gulp');
    const uglify = require('gulp-uglify');
    const filter = require('gulp-filter');
     
    gulp.task('default', () => {
        // Create filter instance inside task function 
        const f = filter(['**', '!*src/vendor']);
     
        return gulp.src('src/**/*.js')
            // Filter a subset of the files 
            .pipe(f)
            // Run them through a plugin 
            .pipe(uglify())
            .pipe(gulp.dest('dist'));
    });
    
    参考文档
    https://www.npmjs.com/package/gulp-filter
    5. 顺序流、并行流
    // gulp-series  gulp.parallel (4.0) 
    // use
    
    gulp.series 
    gulp.task("scripts",gulp.series("test","deploy"))
    
    gulp.parallel
    gulp.tast("mixs",gulp.series("clean",gulp.parallel("style","scripts")))
  • 相关阅读:
    天使投资家李镇樟:如何培养世界级企业家
    [案例分析] 打造值得信任的个人品牌究竟靠什么?
    怎能相逢
    企业的创新和创新的双面性
    给创业者的忠告:中国互联网的柏金森定律
    梦想的婚礼
    企业人,需守候精神商业的价值
    我与东方
    五种成功创业模式让你轻松赚到钱
    一招一式, 成就“霸业”必做的9件大事
  • 原文地址:https://www.cnblogs.com/rongfengliang/p/7819544.html
Copyright © 2011-2022 走看看