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的教学部分,对其的介绍为可以对文件进行合并,压缩,格式化,监听,测试,检查等操作时,看到前三种功能我的心理思想是,网上有很多在线压缩,在线 ...
随机推荐
- idea从github中pull或者push成功之后tomcat启动不了,报Error....
解决方案:删除deployment里面的war包,确定. 再在deployment里面重新添加一个war包,确定,即可.
- HTTP协议响应篇
http响应的基本介绍 一个HTTP响应代表服务器向客户端回送的数据, 由三个部分构成 状态行[200 , 302 304, 403, 404, 500] 响应消息头 返回的实体内容 http响应状态 ...
- pickle,shelve,json,configparser 的模块使用
主要内容1. 什么是序列化2. pickle3. shelve4. json5. configparser模块 一. 什么是序列化在我们存储数据或者网络传输数据的时候. 需要对我们的对象进行处理. 把 ...
- HTML5 新模块元素兼容问题
新增块元素默认样式 下列HTML5新模块元素在IE8.9版本浏览器中没有被定义默认样式.为解决该问题,给下列元素添加“block”显示属性. 代码: article, aside, details, ...
- 第十五篇:java操作oracle踩坑之旅
最近刚做完mysql的各种需求,项目要满足oracle数据库,于是走上了漫漫的踩坑之路,同行可以看看以免踩坑……第一条:oracle建表的时候不需要在建表sql语句后指定默认字符集 DEFAULT C ...
- cmd以管理员打开
- 编写main方法
- 2 _ 基本框架 _ 检测VMX环境
VT 是先开为大,谁先开谁上层,谁上层 谁权限大. 1 判断是否支持 VMX intel 白皮书 第3卷 传入 参数eax =1, 返回值 ecx 的第5位 = 1 则 surpported VMX. ...
- 基础JQ框架
最近在研究jq的插件写法,看jq的源码.这里梳理一个最基本的JQ框架,从jq1.7提取.足够简单 <!DOCTYPE html> <html lang="en"& ...
- vue初学之node.js安装、cnpm安装、vue初体验
1. 如果本机没有安装node运行环境,请下载node 安装包进行安装.地址:https://nodejs.org/en/ 2.装完,使用cmd命令行输入:node -v回车 如果输出版本号则成功. ...