1.安装

  全局安装

npm install --global gulp

  作为项目的开发依赖安装

npm install gulp --save-dev

2.在根目录下创建一个名为gulpfile.js的文件

let gulp = require('gulp');
let cleanCSS = require('gulp-clean-css');//css 打包
let concat = require('gulp-concat');//文件整合
let uglify = require('gulp-uglify');//js压缩插件
let zip = require('gulp-zip');//zip压缩文件
let less = require('gulp-less');//less压缩 gulp.task('minify-css', () => {
return gulp.src('css/imdex.css')
.pipe(concat('imdex.min.css'))
.pipe(cleanCSS())
.pipe(gulp.dest('./css'));
}); gulp.task('uglify-js',()=>{
return gulp.src('./js/*.js')
.pipe(uglify())
.pipe(concat)
.pipe(gulp.dest('./js'))
}) gulp.task('zip-suo',()=>{
return gulp.src('./src/*')
.pipe(zip())
.pipe(gulp.dest('./'))
}) gulp.task('testLess', function () {
gulp.src('src/less/index.less') //该任务针对的文件
.pipe(less()) //该任务调用的模块
.pipe(cleanCSS())
.pipe(gulp.dest('src/css')); //将会在src/css下生成index.css
}); gulp.task('default',['minify-css','uglify-js','testLess']);

gulp.基础的更多相关文章

  1. gulp基础操作实践

    按照gulp中文文档对gulp基础操作的一些实践练习,记录以防忘掉. 一,选择并输出文件:gulp.src(globs[,options]) eg:gulp.src('src/less/index.l ...

  2. Gulp基础

    1.什么是gulp? gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器. 2.为什么使用gulp? gulp不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工 ...

  3. gulp基础使用总结

    gulp 安装 1 检测电脑有没有安装node 执行 $ node -v $ npm -v 如果没有安装的话,可以到https://nodejs.org/en/download/下载安装. 2 全局安 ...

  4. gulp 基础运用

    全局安装gulp $npm install --global gulp 作为项目的开发依赖安装 //--save-dev 开发依赖,储存在package.json的devDependencies中,如 ...

  5. Gulp基础知识

    首先,我们需要了解Gulp能做些什么? 编译 sass                                        sass是什么?(使CSS可以用编程的方式写,加快我们开发的速度) ...

  6. gulp基础使用及进阶

    提示:路径中不允许出现中文,否则scss编译会出错,大概. 按照惯例,先检查一下Node.js.npm(cnpm).gulp的版本号 1.新建package.json 我们可以通过手动新建这个配置文件 ...

  7. 【gulp】工作中的实战

    写这篇文章的目的是为了以后的项目中懒得再去配gulp,直接可以拿这篇博客中的来用,因为有时候配置还是挺烦人的. gulp相关插件的介绍 用法比较简单,假设大家都会用gulp,下面主要介绍一下一些插件的 ...

  8. Gulp真实项目用例

    包括了less预编译,css压缩,html文件include引入,js混淆压缩,本地开发热刷新服务器,html压缩,版本号添加 github地址: gulpfile.js var gulp = req ...

  9. gulp学习-gulpfile

    安装gulp 假设已经安装了node 和npm (淘宝的cnpm很适合国内使用). 1.首页全局安装gulp. 1 npm install --global gulp 2.其次局部安装gulp.(注: ...

随机推荐

  1. Creating A Moddable Unity Game

    前言: 对游戏进行修改与拓展(MOD)是我一直以来感兴趣的东西,我的程序生涯,也是因为在初中接触到GBA口袋妖怪改版开始的,改过也研究过一些游戏的MOD实现方式,早就想在自己的游戏中实现“MOD系统” ...

  2. 【51nod 1331】狭窄的通道

    Description 有一个长为L的狭窄通道,我们假设这个通道在x轴上,其两个出口分别在x=0与x=L处.在这个通道里有N只狼,第i只狼有一个初始位置ai,它想到达位置bi(0<=i<N ...

  3. matplotlib-区域填充

    import numpy as np import matplotlib.pyplot as plt import matplotlib as mpl import datetime #解决能显示中文 ...

  4. C++ 窗口

    DestroyWindow();     //销毁窗口 可重载的事件: PostNcDestroy    窗口销毁后调用

  5. Understanding a project which include NodeJS, Webpack, Vue

    公司有一个web 项目是用 Vue 写的, 前段时间负责这个tool的人离职了没有人维护,其他人又很忙,我就去看了一下以便以后能加一些新功能在上面 没有接触过Vue, 这些理解了一下关系做一些学习记录 ...

  6. Coconuts HDU - 5925 (二维离散化求连通块的个数以及大小)

    题目链接: D - Coconuts  HDU - 5925 题目大意:首先是T组测试样例,然后给你n*m的矩阵,原先矩阵里面都是白色的点,然后再输入k个黑色的点.这k个黑色的点可能会使得原先白色的点 ...

  7. pwnable.kr fb

    fb-1 pt 连接到服务器,发现 有三个文件,fd脚本,fd.c脚本的源程序,flag是要看的东西,无权限 来我们分析一下源码 如果只传进去一个值,print” pass argv[1] a num ...

  8. Maven入门项目创建

    项目构建 1.新建maven项目 2.跳过骨架选择,如果不跳过骨架选择创建出的项目目录是不全的(骨架其实就是项目的模板) 3.Group Id,Artifact Id,Version称为项目的坐标,当 ...

  9. 匿名内部类可以访问的变量---静态成员变量和final修饰的局部变量

    在学习多线程的时候用到了匿名内部类,匿名内部类可以访问static静态成员变量或者final修饰的局部变量. 匿名内部类在编译之后会生成class文件,比如Test内的第一个匿名内部类编译之后就是Te ...

  10. Python 模拟鼠键

    让python 自动操作桌面或应用窗口,点击,滑动鼠标,输入文字等 # coding=utf-8 from pymouse import PyMouse from pykeyboard import ...