gulp实践

 未完待续.......

gulpfile.js

var gulp            = require('gulp'),
    bs              = require('browser-sync').create(),
    concat          = require("gulp-concat"),
    sourceMaps      = require("gulp-sourcemaps"),
    uglify          = require("gulp-uglify"),
    gIf             = require("gulp-if");

var envir = {
    production: false
};

var path = {
    app: './_app/',      //发版app文件夹
    dev: './_develop/',  //开发app文件夹
    vend: './'           //资源包文件夹
};
var app = {
    js: path.app + 'js/',
    css: path.app + 'css/',
    view: path.app
};
var dev = {
    js: path.dev + 'js/',   //开发js文件夹
    css: path.dev + 'css/',  //开发css文件夹
    view: path.dev + 'view/'  //开发html文件夹
};
var vend = {
    js: ''
};
var source = {
    js: [
        dev.js + 'app.init.js', //初始化js
        dev.js + 'module/*.js', //路由配置js
        dev.js + 'module/controllers/*.js', //controllers
        dev.js + 'module/directives/*.js', //directives
        dev.js + 'module/services/*.js', //services
        dev.js + 'custom/**/*.js' //
    ],
    css: [
        dev.css + '**/*.{css,sass,less}'
    ],
    templates: {
        index: [dev.view + 'index.*'],
        views: [dev.view + '**.*', '!' + dev.view + 'index.*'],
    }

};

gulp.task('js', function () {
    return gulp.src(source.js)
        .pipe(gIf(!envir.production, sourceMaps.init({loadMaps: true})))
        .pipe(concat("app.js"))
        .pipe(uglify({
            mangle: false,
            compress: true,
            preserveComments: ""//注释保留
        }))
        .pipe(gIf(!envir.production, sourceMaps.write()))
        .pipe(gulp.dest('./_app/js/'));
});

gulp.task('css', function () {
    return gulp.src('./_develop/css/**/*.css')
        .pipe(gulp.dest('./_app/css/'))
});
gulp.task('html', function () {
    return gulp.src(['./_develop/view/**/*.html'])//base folder 为view,默认两个星号前面的,可以定义{base:'foldername'}
        .pipe(gulp.dest('./_app/'))
});


gulp.task('vendorbase', [], function () {
    return gulp.src(require('./vendor.base.json'), {base: './bower_modules'})
        .pipe(gulp.dest('./_app/vendor/'));
});
gulp.task('vendorms', [], function () {
    return gulp.src(require('./vendor.ms.json'), {base: './vendor'})
        .pipe(gulp.dest('./_app/vendor/'));
});
gulp.task('vendor', function () {
    return gulp.src(require('./vendor.json'), {base: './bower_modules'})
        .pipe(gulp.dest('./_app/vendor/'))
});

gulp.task('serve', ['vendorbase', 'vendorms', 'vendor', 'js', 'css', 'html'], function () {
    bs.init({
        server: {
            baseDir: ['./_app/', './']
        }
    });
    gulp.watch(source.templates, ['html', bs.reload]);
    gulp.watch(source.js, ['js', bs.reload]);
    gulp.watch(source.css, ['css', bs.reload]);
    var watcher = [].concat(
        source.templates,
        source.js,
        source.css
    );
    gulp.watch(watcher).on("change", function (e) {
        console.log("File " + e.path + " was " + e.type + " , running tasks")
    });

    // gulp.watch(['./{vendor.base,vendor,vendorms}.json'],['vendorbase','vendor','vendorms',bs.reload]);
});


gulp.task("production", ["setProduction", "js"]);     //生产版本
gulp.task("setProduction", function () {
    envir.production = true;
});

 

转载于:https://my.oschina.net/u/3304551/blog/847201

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值