一下代码用来简单的压缩 .js  和 .css   ;  在cmd里执行 gulp minifycss    minifyjs,各task执行是正常的。

注意,先安装后相应的模块,建议安装到本地。

说明:  输出到文件为  minified/js    minified/css   ;

    这里面就return 的地方为同步;

在执行的时候代码不能一下执行完,求解。?????????

//在项目的根目录新建gulpfile.js,require需要的module

var gulp = require('gulp'),

minifycss = require('gulp-minify-css'),

concat = require('gulp-concat'),

uglify = require('gulp-uglify'),

rename = require('gulp-rename'),

del = require('del');

//压缩css
    //加return后是同步的  后面同是

gulp.task('minifycss', function() {

return gulp.src('src/*.css')      //压缩的文件

.pipe(gulp.dest('minified/css'))   //输出文件夹

.pipe(minifycss());   //执行压缩

});

//压缩js
    gulp.task('minifyjs', function() {

return gulp.src('src/*.js')

.pipe(concat('main.js'))    //合并所有js到main.js

.pipe(gulp.dest('minified/js'))    //输出main.js到文件夹

.pipe(rename({suffix: '.min'}))   //rename压缩后的文件名

.pipe(uglify())    //压缩

.pipe(gulp.dest('minified/js'));  //输出

});

//执行压缩前,先删除输出文件夹里的内容

gulp.task('clean', function(cb) {

del(['minified/css', 'minified/js'], cb)

});

//默认命令,在cmd中输入gulp后,执行的就是这个命令

gulp.task('default', ['clean'], function() {

gulp.start('minifycss', 'minifyjs');

});

gulp 压缩文件2 摘的更多相关文章

  1. 运用Gulp压缩文件编译文件。包括css js html image

    安装node.js  npm  以及安装gulp等方法我就不在这里赘述了. 接下里我主要介绍的是Gulpfile文件里面的配置该如何书写. var gulp = require('gulp');//引 ...

  2. gulp压缩文件最简示例

    安装gulp-uglify 作为项目的开发依赖即可 $ npm gulp-uglify --save-dev 压缩js文件 gulpfile.js const gulp = require('gulp ...

  3. Gulp压缩前端CS,JS,图片文件

    Gulp 基于Node.js的前端构建工具,Gulp有许多插件(这里是插件),使用Gulp可以实现前端代码的编译(sass.less).压缩.图片的压缩等,当然主要是前端工程化,不过我目前只是需要压缩 ...

  4. [转]gulp排除已压缩文件思路

    文章转载至[gulp排除已压缩文件思路] gulp默认排除语法的弊端 有个时候我们需要时用gulp排除已经压缩过的js,css等.如果以压缩文件是以".min.js"之类命名规范的 ...

  5. gulp压缩html,css,js文件流程、监听任务、使用gulp创建服务器、同时运行多个任务、反向代理

    一.初始化 首先先做一个项目初始化,用来记录你项目中用到的工具 再你项目文件下打开一个控制台,输入命令 yarn init -y 进行初始化 输入命令yarn add gulp -g  --- 全局安 ...

  6. 摘:C#压缩文件

    [[[[C#压缩文件]]]] 方法1: //[filepath想要压缩文件的地址] //[zippath输出压缩文件的地址] private void GetFileToZip(string file ...

  7. 《Gulp 入门指南》 : 使用 gulp 压缩 JS

    <Gulp 入门指南> : 使用 gulp 压缩 JS 请务必理解如下章节后阅读此章节: 安装 Node 和 gulp 访问论坛获取帮助 压缩 js 代码可降低 js 文件大小,提高页面打 ...

  8. gulp 压缩 js 和 css 代码

    我们在写出来的代码都是非常规范的,改换行的时候就换行,改tab 的时候就有tab,还有这样做是为了后期维护方便,但是这也导致了内存占用量的增大,当把把代码发到线上,如果网速慢一点,可能很久都加载不出来 ...

  9. gulp压缩css和js

    压缩 css 代码可降低 css 文件大小,提高页面打开速度. 规律转换为 gulp 代码 找到 css/ 目录下的所有 css 文件,压缩它们,将压缩后的文件存放在 dist/css/ 目录下.一. ...

随机推荐

  1. JAVA封装、继承、多态

    封装 1.概念: 将类的某些信息隐藏在类的内部,不允许外部程序访问,而是通过该类提供的方法来实现对隐藏信息的操作和访问. 2.好处: a.只能通过规定的方法访问数据 b.隐藏类的实例细节,方便修改和实 ...

  2. 记一次docker镜像导出导入流程

    目标:导出测试环境的镜像到本地机器 过程: 测试机: docker save -o /Dockerfile/crontabService/php72.tar lnmp72:v1.4 压缩,要不文件太大 ...

  3. Golang最强大的访问控制框架casbin全解析

    Golang最强大的访问控制框架casbin全解析 Casbin是一个强大的.高效的开源访问控制框架,其权限管理机制支持多种访问控制模型.目前这个框架的生态已经发展的越来越好了.提供了各种语言的类库, ...

  4. 7月17日刷题记录 分治Getting!循环比赛日程表

    通过数:1 ┭┮﹏┭┮ qdoj.xyz 1053 分治-循环比赛日程表 其实今天晚上留给编程的时间并不多,做出一道... 不过收获还是非常大的 毕竟本人从来没有学习过分治算法,今天竟然攻克了我人生中 ...

  5. React躬行记(16)——React源码分析

    React可大致分为三部分:Core.Reconciler和Renderer,在阅读源码之前,首先需要搭建测试环境,为了方便起见,本文直接采用了网友搭建好的环境,React版本是16.8.6,与最新版 ...

  6. Java入门 - 语言基础 - 12.Number和Math类

    原文地址:http://www.work100.net/training/java-number-math.html 更多教程:光束云 - 免费课程 Number和Math类 序号 文内章节 视频 1 ...

  7. 异数OS TCP协议栈测试(一)--数据传输篇

    异数OS TCP协议栈测试(一)--数据传输篇 本文来自异数OS社区 github:   异数OS-织梦师(消息中间件)群: 476260389 测试目标 数据传输IO性能测试,主要是建立连接后测试收 ...

  8. leetcode 全解(python版)

    本着blabla的精神,在这里(可能会)给出leetcode的全部习题答案 --持续更新中... 1.给定一个整数数组 nums 和一个目标值 target,请你在该数组中找出和为目标值的那 两个 整 ...

  9. 个人第4次作业——alpha项目测试

    这个作业属于哪个课程 http://edu.cnblogs.com/campus/xnsy/GeographicInformationScience 这个作业的要求在哪里 https://www.cn ...

  10. os模块常用方法笔记

    os模块是程序和系统文件之间的交互接口,可以实现对文件的创建.删除等功能,以下对os模块的功能做一个笔记,方便以后学习和查找. import os os.getcwd() #获取当前工作目录,即当前p ...