GULP入门(一)
1.首先要先装node.然后在命令行里安装全局的gulp:
npm install --global gulp

这是gulp在的生成的位置
2.接下来,我们需要将gulp安装到项目本地
npm install —-save-dev gulp
这里,我们使用 —-save-dev 来更新package.json文件,更新 devDependencies值,以表明项目需要依赖gulp。
Dependencies 可以向其他参与项目的人指明项目在开发环境和生产环境中的node模块依懒关系,想要更加深入的了解它可以看看 package.json文档 。
3.接下来加载gulp的插件,我现在主要是压缩 ,下面装了三个插件,分别是合并,最小化和混淆。

4.在项目的中创建gulpfile.js
var gulp = require('gulp'),
uglify = require('gulp-uglify'),
concat = require('gulp-concat'),
del = require('del')
gulp.task('js',function(){
return gulp.src('./routes/*.js') //有的JavaScript文件,然后排除后缀为.min.js的文件: gulp.src(['js/**/*.js', '!js/**/*.min.js'])
.pipe(uglify()) //取消文件缩进
.pipe(concat('app.js')) //合并
.pipe(gulp.dest('dist/js')) //保存为build/app.js
})
/*gulp.task('clean',function(cb){
del(['dist/js'],cb)
})*/
gulp.task('default',function(){
// 将你的默认的任务代码放在这
gulp.start('js')
})
5.然后运行

GULP入门(一)的更多相关文章
- Gulp入门教程(转载)
本人转载自: Gulp入门教程
- (转)前端构建工具gulp入门教程
前端构建工具gulp入门教程 老婆婆 1.8k 2013年12月30日 发布 推荐 10 推荐 收藏 83 收藏,20k 浏览 本文假设你之前没有用过任何任务脚本(task runner)和命令行工具 ...
- 《Gulp 入门指南》 : 使用 gulp 压缩 JS
<Gulp 入门指南> : 使用 gulp 压缩 JS 请务必理解如下章节后阅读此章节: 安装 Node 和 gulp 访问论坛获取帮助 压缩 js 代码可降低 js 文件大小,提高页面打 ...
- Gulp入门与解惑
Gulp简介 Gulp.js 是一个自动化构建工具,开发者可以使用它在项目开发过程中自动执行常见任务.Gulp.js是基于 Node.js构建的,利用Node.js流的威力,你可以快速构建项目. 安装 ...
- gulp 入门使用
gulp 入门使用 使用场景 相信大家在传统的开发模式下 都是 html + css + js 然后静态文件不经过任何处理 部署到服务器,这样会有很多漏洞例如: 1.在网站上查看F12 就可以看到 ...
- 【转】Gulp入门基础教程
Gulp入门基础教程 原文在此 前言最近流行前端构建工具,苦于之前使用Grunt,代码很难阅读,现在出了Gulp, 真是摆脱了痛苦.发现了一篇很好的Gulp英文教程,整理翻译给大家看看. 为什么使用G ...
- gulp入门与一些基本设置
这里是gulp入门的一些操作,实现了编译sass文件.压缩.合并.添加版本号等基本功能. 友情提示,如果npm出现无法下载可以安装 cnpm.在安装完Nodejs 后 npm install cnpm ...
- gulp入门演练
一直想学习下gulp看了蛮多资料,然后总是感觉是是而非,突然开窍了,把自己学会的过程给大家分享下,入门超级简单的 gulp安装 安装gulp 如果参数-g 表示全局安装 $ npm install g ...
- 前端小白的gulp入门
gulp新手入门 全局安装 cnpm install -g gulp 本地安装cnpm install gulp -D 如果项目没有package.json,记得npm init 安装插件cnpm i ...
- gulp入门学习教程(入门学习记录)
前言 最近在通过教学视频学习angularjs,其中有gulp的教学部分,对其的介绍为可以对文件进行合并,压缩,格式化,监听,测试,检查等操作时,看到前三种功能我的心理思想是,网上有很多在线压缩,在线 ...
随机推荐
- 出现java.lang.NoClassDefFoundError: org/apache/commons/collections/FastHashMap错误问题解决
首先出现这个问题,你应该是用了 BeanUtils.populate(meter,map); import org.apache.commons.beanutils.BeanUtils;并且导入了co ...
- 03_mybatis配置文件详解
1. SqlMapConfig.xml mybatis全局配置文件SqlMapConfig.xml,配置内容如下: *properties(属性) setting(全局配置参数) typeAliase ...
- 连接 MySQL 报错:Lost connection to MySQL server at 'reading authorization packet', system error: 34
报错信息: Lost connection to MySQL server at 解决方案: use mysql; ; flush privileges; 参考: https://blog.csdn. ...
- 【数位DP】[LOJ10168] 恨7不成妻
还是数位DP... 状态:$f[x][val][sum]$表示当前第x位,当前数字为val,当前各位数字和为sum 观察到$val$,$sum$过大,很套路地模7即可... 每个状态存储三个要用到的值 ...
- [NOIP2019模拟赛]夹缝
夹缝 问题描述: 二维空间内有两面相对放置的,向无限远延伸的镜子,以镜子的方向及其法向量建立坐标系,我们选定一个法向量方向下面称“上”.在镜子上的整数位置,存在着一些传感器,传感器不影响光线的反射,光 ...
- Luogu P2717 寒假作业(平衡树)
P2717 寒假作业 题意 题目背景 \(zzs\)和\(zzy\)正在被寒假作业折磨,然而他们有答案可以抄啊. 题目描述 他们共有\(n\)项寒假作业.\(zzy\)给每项寒假作业都定义了一个疲劳值 ...
- Pascal的sin^-1函数实现
function unsin(t:real):real; var l,r,ans,mid:longint; function dsin(z:real):real; begin exit(sin(z*p ...
- loj2212 方伯伯的OJ
题意: n<=1e8,m<=1e5. 标程: #include<cstdio> #include<algorithm> #include<cstring> ...
- php日期
PHP Date() 函数 PHP date() 函数用于格式化时间/日期. 该函数可把时间戳格式化为可读性更好的日期和时间. 时间戳是一个字符序列,表示一定的事件发生的日期/时间. 语法 date( ...
- light oj 1098 数学规律
#include <stdio.h> #include <string.h> #include <stdlib.h> #include <math.h> ...