• glup 基础插件应用 随笔


    var gulp = require("gulp"),//全局安装gulp(必须,没有它别的都废啦)
        concat = require("gulp-concat"),//合并js文件
        uglify = require("gulp-uglify"),//压缩js文件
        rename = require('gulp-rename'),//重命名文件流文件
        cssmin = require('gulp-minify-css'),//压缩css文件
        htmlmin = require('gulp-htmlmin'),//压缩html文件
        clean = require("gulp-clean"),//删除文件
        copy = require("gulp-copy");//复制文件
    zip = require("gulp-zip");//压缩打包成zip文件
    
    var paths = ["jquery/jquery.js", "jquery/jquery.fullscreen.js", "js/FullScreen.js", "js/SecondManager.js", "js/Label.js", "js/Differences.js", "js/Scene.js", "js/StartScene.js", "js/GameScene.js", "js/TimeoutScene.js", "js/CompleteScene.js", "js/Audio.js", "js/Game.js", "js/GameSceneDatas.js", "js/Main.js"];
    
    gulp.task("test", function () {
        console.log("concat      合并js文件");
        console.log("uglify      压缩js文件");
        console.log("cssmin      压缩css文件");
        console.log("htmlmin     压缩html文件");
        console.log("clean       删除文件");
        console.log("copy        复制文件");
        console.log("zip         压缩打包成zip文件");
        console.log("watch       监控文件修改");
    })
    
    gulp.task("concat", function () {
        return gulp.src(paths)
            .pipe(concat("index.js"))
            .pipe(gulp.dest("dist/"));
    })
    
    gulp.task("uglify",["concat"], function () {//执行压缩前会先执行一边合并
        return gulp.src("dist/index.js")
            .pipe(uglify())
            .pipe(rename("index.min.js"))
            .pipe(gulp.dest("dist/"));
    })
    
    gulp.task("cssmin", function () {
        return gulp.src("index.css")
            .pipe(cssmin())
            .pipe(rename("index.min.css"))
            .pipe(gulp.dest("dist/"))
    })
    
    
    gulp.task('htmlmin', function () {
        var options = {
            removeComments: true,//清除HTML注释
            collapseWhitespace: true,//压缩HTML
            //省略布尔属性的值 <input checked="true"/> ==> <input />
            collapseBooleanAttributes: true,
            //删除所有空格作属性值 <input id="" /> ==> <input />
            removeEmptyAttributes: true,
            //删除<script>的type="text/javascript"
            removeScriptTypeAttributes: true,
            //删除<style>和<link>的type="text/css"
            removeStyleLinkTypeAttributes: true,
            minifyJS: true,//压缩页面JS
            minifyCSS: true//压缩页面CSS
        };
        return gulp.src('index.html')
            .pipe(htmlmin(options))
            .pipe(rename("index.min.html"))
            .pipe(gulp.dest(''));
    });
    
    gulp.task("clean",["uglify"],function () {//删除文件前会先执行压缩,确保删除文件以备压缩执行
        return gulp.src("dist/index.js")
            .pipe(clean());
    })
    
    gulp.task("copy", function () {
        return gulp.src(["mp3/**", "images/**"])
            .pipe(copy("./dist"));
    })
    
    
    gulp.task("zip", ["cssmin", "htmlmin","clean", "copy"], function () {
        return gulp.src(["dist/**","index.min.html"])
            .pipe(zip("jaja.zip"))
            .pipe(gulp.dest(""))
    })
    
    
    gulp.task("watch", function () {
        gulp.watch("js/*.js", ['concat', 'uglify'])
        gulp.watch("index.css", ['cssmin'])
        gulp.watch("index.html", ['htmlmin'])
    })
  • 相关阅读:
    中国各城市PM2.5数据间的相关分析
    vue中template的作用及使用
    Vue 点击获得父元素,子元素,兄弟元素(DOM操作)
    解决elementUI中message消息多次重复展现的问题
    Uncaught (in promise) NavigationDuplicated {_name: "NavigationDuplicated"}的解决方法
    v-focus给input设置焦点
    Cannot find name 'template'.Vetur 问题解决
    vue的prototype和拦截器
    Nginx下载启动
    Nginx负载均衡原理
  • 原文地址:https://www.cnblogs.com/huangjinliang/p/5836814.html
Copyright © 2020-2023  润新知