美文网首页
gitfile.js中的内容

gitfile.js中的内容

作者: MGd | 来源:发表于2017-06-07 08:58 被阅读2次
var app = {  // 定义目录
    srcPath:'src/',
    buildPath:'build/',
    distPath:'dist/'
}
//1.引入gulp与gulp插件   使用时,要去下载这些插件
var gulp = require('gulp');
var less = require('gulp-less');
var cssmin = require('gulp-cssmin');
var uglify = require('gulp-uglify');
var concat = require('gulp-concat');
var connect = require('gulp-connect');
var imagemin = require('gulp-imagemin');
var open = require('open');
//把bower下载的前端框架放到我们项目当中
gulp.task('lib',function () {
    gulp.src('bower_components/**/*.js')
        .pipe(gulp.dest(app.buildPath+'lib'))
        .pipe(gulp.dest(app.distPath+'lib'))
        .pipe(connect.reload()) //当内容发生改变时, 重新加载。
});
//2.定义任务 把所有html文件移动另一个位置
gulp.task('html',function () {
//要操作哪些文件 确定源文件地址
    gulp.src(app.srcPath+'**/*.html')  /*src下所有目录下的所有.html文件*/
        .pipe(gulp.dest(app.buildPath)) //gulp.dest 要把文件放到指定的目标位置
        .pipe(gulp.dest(app.distPath))
        .pipe(connect.reload()) //当内容发生改变时, 重新加载。
});
//3.执行任务 通过命令行。gulp 任务名称
//定义编译less任务  下载对应的插件 gulp-less
//把less文件转成css放到build
gulp.task('less',function () {
    gulp.src(app.srcPath+'style/index.less')
        .pipe(less())
        .pipe(gulp.dest(app.buildPath+'css/'))
        /*经过压缩,放到dist目录当中*/
        .pipe(cssmin())
        .pipe(gulp.dest(app.distPath+'css/'))
        .pipe(connect.reload())
});
//合并js
gulp.task('js',function () {
    gulp.src(app.srcPath+'js/**/*.js')
        .pipe(concat('index.js'))
        .pipe(gulp.dest(app.buildPath+'js/'))
        .pipe(uglify())
        .pipe(gulp.dest(app.distPath+'js'))
        .pipe(connect.reload())
});
//压缩图片
gulp.task('image',function () {
    gulp.src(app.srcPath+'images/**/*')
        .pipe(gulp.dest(app.buildPath+'images'))
        .pipe(imagemin())
        .pipe(gulp.dest(app.distPath+'images'))
        .pipe(connect.reload())
});
//同时执行多个任务 [其它任务的名称]
// 当前bulid时,会自动把数组当中的所有任务给执行了。
gulp.task('build',['less','html','js','image','lib']);
//定义server任务
//搭建一个服务器。设置运行的构建目录
gulp.task('server',['build'],function () {
    //设置服务器
    connect.server({
        root:[app.buildPath],//要运行哪个目录
        livereload:true,  //是否热更新。
        port:8888  //端口号
    })
    //监听哪些任务
    gulp.watch('bower_components/**/*',['lib']);
    gulp.watch(app.srcPath+'**/*.html',['html']);
    gulp.watch(app.srcPath+'js/**/*.js',['js']);
    gulp.watch(app.srcPath+'images/**/*',['image']);
    gulp.watch(app.srcPath+'style/**/*.less',['less']);
    //通过浏览器把指定的地址 (http://localhost:9999)
    open('http://localhost:8888');
});
//定义默认任务
//直接执行gulp 会调用的任务
gulp.task('default',['server']);

相关文章

  • gitfile.js中的内容

  • 内容加载中

    点开简书,不知道写什么内容,不知道要记录什么,只知道不能停更。21天养成一个习惯,对自己的要求不高,不急不停 约了...

  • 内容中台的内容理解与应用

    文章发布于公号【数智物语】(ID:decision_engine),关注公号不错过每一篇干货。 来源 | 张大本事...

  • 课题:cookie中的内容与Redis缓存中的内容合并

    案例:以京东购物网的购物车为例,当用户以游客身份(即未登录)进行网页浏览,见到自己 满意的商品可以加到购物车(co...

  • 运营中的内容组织

    早期的微博内容字数,不能超过140字;早期的小咖秀,用户只能通过已有音乐和字幕进行对口型的拍摄。 对于一个内容密...

  • 绩效报告中的内容

    包含历史的、现在的和将来的,以及意见或建议等。 10.2管理沟通(发布信息)工具-报告绩效里提到,报告绩效是指手机...

  • 寒冬中的内容社区

    币车悄无声息的被封,我们姑且相信官方的被工信部查封的说法,确实震惊到了我,寒冬方知彻骨冷,或许无数...

  • 读了《 圣经》中的内容

    有3500年历史的《圣经》中(利未记第11章)就明确指出人类的食物有哪些,也明确指出哪些不可食。明确指出蝙蝠不可食...

  • iOS中的UIProgress的内容

    我看到这个,以为是进度条,从而看了-一下进度条的内容,发现并不符合,而是应该是UISlider这个控件进行实现; ...

  • 【配置】Ubuntu下搭建深度学习环境

    修改中。。。内容有误 修改中。。。内容有误 修改中。。。内容有误 修改中。。。内容有误 修改中。。。内容有误 注意...

网友评论

      本文标题:gitfile.js中的内容

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