自动化构建工具gulp的基础了解
1.使用gulp的步骤
1.安装node
检测是否安装好 cmd->node -v
2.安装gulp 可以在npm或者在cnpm
3.在node里面有个文件package.json.利用命令行npm init
4.本地安装插件,在这个文件夹中,直接在npm下载下来
5.在文件夹中新建一个gulpfile.js(名字必须是这个),其他的代码都是写在这个xxx.js的文件中的
2.基本语法
gulp.task("defult",function(){
return gulp.src(源文件夹)
.pipe(插件名称())
.pipe(插件名称())
.pipe(gulp.dest(目标文件夹))
});
gulp.task("min",function(){
return gulp.src(源文件夹)
.pipe(插件名称())
.pipe(插件名称())
.pipe(gulp.dest(目标文件夹))
});
//gulp.task(name[, deps], fn) 定义任务 name:任务名称 deps:依赖任务名称 fn:回调函数
//gulp.src(globs[, options]) 执行任务处理的文件 globs:处理的文件路径(字符串或者字符串数组)
//gulp.dest(path[, options]) 处理完后文件生成路径
gulp的基础语法
1.gulp.task('任务名称',‘依赖任务’,函数);
注意:依赖任务并行执行,然后运行任务名称
2.gulp.src()
3.gulp.dest()
4.gulp.watch(glob [, opts], tasks) or gulp.watch(glob [, opts, cb]) 就是监视文件的变化,然后运行指定的Tasks或者函数,
3.运行gulp
gulp 任务名称
4.为什么采用gulp
gulp和grunt的区别
gulp 基于流 配置优先 1000+插件
grunt 基于文件 代码优先 3900+插件
这个相比Grunt需要使用插件,gulp本身就支持的很好。
其他的就是练习就成了!!!
自动化构建工具gulp的基础了解的更多相关文章
- 前端自动化构建工具gulp的使用总结
前端自动化构建工具gulp的使用总结 博主最近偶的空闲,在此对gulp的使用做一个总结,让小伙伴知道如何合理的使用gulp以及gulp的使用技巧. 谈到gulp,有人可能就会想到另外一个构建工具gru ...
- 前端自动化构建工具——gulp
gulp是基于流的前端自动化构建工具. 一.环境配置 gulp是基于nodejs的,所以没有 nodejs 环境的要先去安装好 然后给系统配上gulp环境 npm install -g gulp 再到 ...
- 前端自动化构建工具 Gulp 使用
一个月没写博客了,今天有时间,就写个gulp的入门使用吧.. 简介:gulp是一个前端自动化构建工具,可以实现代码的检查.压缩.合并……等等,gulp是基于Node.js的自动任务运行器 一.安装No ...
- 前端自动化构建工具--Gulp&&Webpack
前端构建工具的作用可以认为是对源项目文件或资源进行文件级处理,将文件或资源处理成需要的最佳输出结构和形式. 在处理过程中,我们可以对文件进行模块化引入.依赖分析.资源合并.压缩优化.文件嵌入.路径替换 ...
- 前端自动化构建工具 gulp 学习笔记 一、
一.我对gulp的初期理解 是一种前端辅助开发工具 可以帮你把js,css,img等文件 合并.压缩,图片好像是合并为精灵图,合并为精灵图之后,还会生成一个css样式表. 官方解说是:基于流的自动化构 ...
- 基于流的自动化构建工具------gulp (简单配置)
项目上线也有一阵子,回头过来看了看从最初的项目配置到开发的过程,总有些感慨,疲软期,正好花点时间,看看最初的配置情况 随着前端的发展,前端工程化慢慢成为业内的主流方式,项目开发的各种构建工具,也出现了 ...
- 前端自动化构建工具-gulp
gulp 和grunt这两个是我知道的自动构建工具,但是说实话都没在项目中用过,不太清楚自动化构建是什么意思, 1.grunt和gulp有什么相同点和不同点? (1).易于使用:采用代码优于配置策略, ...
- 前端自动化构建工具——gulp环境搭建教程
gulp是前端工程化的工具,它可以对html,css,js等代码和图片进行压缩,也可以对sass和less等预处理语言进行编译,代码部署.gulp学起来简单,用起来方便,大大提高我们工作效率. 这里可 ...
- 自动化构建工具gulp简单介绍及使用
一.简介及安装: gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用她,我们不仅可以很愉快 ...
随机推荐
- 1.jQuery入口函数 与javaScript入口函数
1.jQuery入口函数 与javaScript入口函数 JQ入口函数: $(document).ready(function(){ }); 或者 $(function(){ }) Js入口函数: w ...
- Window Live Writer在Win7下安装提示错误“OnCatalogResult:0x80190194”
1.在C:\Users\All Users\Microsoft\WLSetup\Logs下(All Users默认是隐藏文件夹),有两个Window Live的安装日记记录文件,打开第一个找到ERRO ...
- 图像标注工具labelImg使用方法
最近在做打标签的工作,为了与大家参考学习,总结了在windows的环境下,基于anaconda的图像标注工具labellmg的一种使用方法! 1 搭建anaconda 以前写过怎么搭建anaconda ...
- MATLAB求解非线性方程组
matlab中有专门的solve函数来解决方程组的(a-x)^2+(b-y)^2=e^2(C-x)^2+(D-y)^2=v^2已知a,b,c,d,e,v 值求解 X,Y 请问用 matlab 如何写, ...
- PAT1060【大模拟啊】
怎么麻烦怎么来了??? 提供几个案例: 5 0.00001 0.00001 0 0.0 0.0222 1 0.001 0.2000 2 005.06 0.230 1 00.020 0 贴份代码跑.. ...
- cf873F(xjb+二分)
题目链接:http://codeforces.com/problemset/problem/837/F 题意:给出一个大小为 n 的数组 a 和一个数 k,每次操作后的到一个 a' 数组,a'i 为 ...
- android--系统路径获取
Environment 常用方法: * 方法:getDataDirectory()解释:返回 File ,获取 Android 数据目录.* 方法:getDownloadCacheDirectory( ...
- 软件包管理(rpm&yum)
一.rpm包管理器 rpm是一个功能强大的包管理工具,可用于构建,安装,查询,验证,更新和卸载软件包. 用法: rpm [OPTION...] 配置文件: /var/lib/rpm/ 已安装rpm包的 ...
- ldap第二天-yum安装LDAP + phpLDAPadmin
1.安装LDAP服务器和客户端,migrationtools工具包 yum install -y openldap-servers openldap-clients migrationtools 2. ...
- Proxy模式(代理[延迟]模式)
Proxy?? Proxy是"代理人"的意思,它指的是代替别人进行工作的人.代理实际上就是使用委托的机制,在代理的过程中你可以做点其他的事情,然后再来执行被代理对象的代码. 知识储 ...