zoukankan      html  css  js  c++  java
  • Gulpfile.js——编译、压缩、合并js和css文件

    gulp 一个入门教程:http://www.ydcss.com/
    gulp API文档地址:http://www.gulpjs.com.cn/docs/api/



    我的一个Low版的gulpfile
    var gulp = require('gulp');
    gulpif = require('gulp-if');
    sass = require('gulp-sass');
    concat = require('gulp-concat');
    rename = require('gulp-rename');
    cssmin = require('gulp-cssmin');
    uglify = require('gulp-uglify');
    clean = require('gulp-clean');

    gulp.task('clean',function(){
    gulp.src(['dist/css/*','dist/js/*'],{read:false})
    .pipe(clean());
    });
    //将bower的库文件对应到指定位置
    gulp.task('bowerCopy', function() {
    //fonts
    gulp.src('bower_components/bootstrap/fonts/**')
    .pipe(gulp.dest('vender/fonts'));
    //js
    gulp.src('bower_components/jquery/dist/jquery.mim.js')
    .pipe(gulp.dest('vender/js'));
    gulp.src('bower_components/jquery/dist/jquery.mim.map')
    .pipe(gulp.dest('vender/js'));

    gulp.src('bower_components/angular/angular.min.js')
    .pipe(gulp.dest('vender/js'));
    gulp.src('bower_components/angular/angular.min.js.map')
    .pipe(gulp.dest('vender/js'));
    gulp.src('bower_components/bootstrap/dist/js/bootstrap.min.js')
    .pipe(gulp.dest('vender/js'));

    //css
    gulp.src('bower_components/bootstrap/dist/css/bootstrap.min.css')
    .pipe(gulp.dest('vender/css'));
    gulp.src('bower_components/bootstrap/dist/css/bootstrap-theme.min.css')
    .pipe(gulp.dest('vender/css'));
    gulp.src('bower_components/sui/dist/css/sui.min.css')
    .pipe(gulp.dest('vender/css'));
    });

    //Compile SASS
    gulp.task('sass-complie', function(){
    gulp.src('src/sass/*.scss')
    .pipe(sass())
    .pipe(gulp.dest('dist/css'));
    });
    //转移js
    gulp.task('src-move',function(){
    gulp.src('src/js/*.js')
    .pipe(gulp.dest('dist/js'));
    gulp.src('src/css/*.css')
    .pipe(gulp.dest('dist/css'));
    });

    // //合并js文件
    // gulp.task('scripts-concat',function(){
    // gulp.src('src/js/*.js')
    // .pipe(concat('all.js'))
    // .pipe(gulp.dest('dist/js'))
    // });

    //压缩css文件
    gulp.task('css-min',function(){
    gulp.src('dist/css/*.css')
    .pipe(cssmin())
    .pipe(rename({suffix:'.min'}))
    .pipe(gulp.dest('dist/css'));
    });


    //压缩js文件
    gulp.task('js-min',function(){
    gulp.src('src/js/*.js')
    .pipe(uglify())
    .pipe(rename({suffix:'.min'}))
    .pipe(gulp.dest('dist/js'));
    });

    gulp.task('default',['bowerCopy','sass-complie','src-move']);
  • 相关阅读:
    docker save docker load
    Vue 开发线路 资料 汇总
    electron 开发拆坑总结
    mysqldbcopy 数据库复制工具
    用rsync命令删除大文件夹
    linux nc,nmap,telnet ,natstat命令
    搭建云版容器版本 需要的基础软件 安装工具
    phantomjs 前端测试工具
    消息列队 php 基于redis 实现
    部分安卓机器【小米手机】,文字显示不全
  • 原文地址:https://www.cnblogs.com/vanstrict/p/5715653.html
Copyright © 2011-2022 走看看