gulp是用来干什么的?(概念)
当我们在使用gulp的时候,gulp到底用来干什么呢?
- 编译 sass
- 合并优化压缩 css
- 校验压缩 js
- 优化图片
- 添加文件指纹(md5)
- 组件化头部底部(include html)
- 实时自动刷新…
- ......
- 压缩静态资源
- 变更静态资源
- 给静态资源添加 md5
- 修改预处理样式后自动编译(SASS,Less)
- 合并雪碧图
- 自动刷新浏览器
- ......
- Sass编译
- Css Js 图片压缩
- Css Js 合并
- Css Js 内联
- Html的include功能
- Autoprefixer
- 自动刷新
- 去缓存
- Handlebars模板文件的预编译
- 雪碧图
- ESLint
- rem移动端适配方案
总之,gulp是前端开发过程中对代码进行自动化构建的利器。它不仅能对资源进行优化,而且在开发过程中能够通过配置自动完成很多重复的任务,让我们可以专注于代码,提高工作效率。
然而由于众所周知的原因,国内到 npm 服务器的连接很不稳定,如果你有V了个PN大可不必担心,也可通过设置 npm 代理服务器的方式访问:
// 设置代理
npm config set proxy="http://127.0.0.1:1080"
// 删除代理
npm config delete proxy
推荐一个简单的方案:使用淘宝 npm 镜像
“这是一个完整 npmjs.org 镜像,你可以用此代替官方版本(只读),同步频率目前为 10分钟 一次以保证尽量与官方服务同步。” —— 淘宝团队点赞
npm config set registry="https://registry.npm.taobao.org"
npm config set disturl https://npm.taobao.org/dist
如上设置完npm淘宝镜像的话,之后的命令使用还是使用的npm而不是现编的使用cnpm来代替npm
当然你也可以执行如下的命令:
npm install cnpm -g --registry=https://registry.npm.taobao.org
直接使用cnpm代替npm里操作!
初步准备工作准备完毕,接下来 gulp 教程了:参考上一篇随笔
gulp是用来干什么的?(概念)的更多相关文章
- 常用 Gulp 插件汇总 —— 基于 Gulp 的前端集成解决方案(三)
前两篇文章讨论了 Gulp 的安装部署及基本概念,借助于 Gulp 强大的 插件生态 可以完成很多常见的和不常见的任务.本文主要汇总常用的 Gulp 插件及其基本使用,需要读者对 Gulp 有一个基本 ...
- Gulp的简单使用
我比较喜欢使用Gulp,因为简单好用! 今天的任务是:使用Gulp来压缩 jQuery源码,各输出一个压缩的和未压缩的版本 第一步:安装 cnpm install gulp --save-dev cn ...
- 基于webpack和vue.js搭建开发环境
前言 在对着产品高举中指怒发心中之愤后,真正能够解决问题的是自身上的改变,有句话说的好:你虽然改变不了全世界,但是你有机会改变你自己.秉承着“不听老人言,吃亏在眼前”的优良作风,我还是决定玩火自焚. ...
- webpack + vuejs 基本配置(一)
开始之前 本文包含以下技术,文中尽量给与详细的描述,并且附上参考链接,读者可以深入学习: 1.webpack2.Vue.js3.npm4.nodejs —- 这个就不给连接了,因为上面的连接都是在你实 ...
- webpack + vue
开始之前 本文包含以下技术,文中尽量给与详细的描述,并且附上参考链接,读者可以深入学习: 1.webpack2.Vue.js3.npm4.ES6语法 前言 在对着产品高举中指怒发心中之愤后,真正能够解 ...
- webpack + vuejs(都是1.0的版本) 基本配置(一)
开始之前 本文包含以下技术,文中尽量给与详细的描述,并且附上参考链接,读者可以深入学习: 1.webpack12.Vue.js13.npm4.nodejs —- 这个就不给连接了,因为上面的连接都是在 ...
- gulpjs
http://www.cnblogs.com/2050/p/4198792.html 这篇文章很全面的讲解了gulpjs的使用 https://www.jianshu.com/p/9723ca2a ...
- 前端构建工具之争——Webpack vs Gulp 谁会被拍死在沙滩上
.table tr>td:nth-child(1){width: 2em !important;padding-left: .6rem !important;padding-right: .6r ...
- Webpack vs Gulp
Webpack vs Gulp 谁会被拍死在沙滩上 本文组织结构 理想的前端开发流程 Gulp 为何物 Webpack 又是从哪冒出来的 结论 文章有点长,总共 1800 字,阅读需要 18 分钟 ...
随机推荐
- install chrome on ubuntu14.04
summary chrome broswer can't found in ubuntu14.04 default source list.To install chrome ,you must ad ...
- Graham扫描法 --求凸包
前言: 首先,什么是凸包? 假设平面上有p0~p12共13个点,过某些点作一个多边形,使这个多边形能把所有点都“包”起来.当这个多边形是凸多边形的时候,我们就叫它“凸包”.如下图: 然后,什么是凸包 ...
- PTA 10-排序6 Sort with Swap(0, i) (25分)
题目地址 https://pta.patest.cn/pta/test/16/exam/4/question/678 5-16 Sort with Swap(0, i) (25分) Given a ...
- 【Go】Panic函数
panic(运行时恐慌)是一种只会在程序运行时才回抛出来的异常.在panic被抛出之后,如果没有在程序里添加任何保护措施的话,程序就会在打印出panic的详情,终止运行. 如果一个panic是无意间引 ...
- poj 1418 Viva Confetti
Viva Confetti Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 1025 Accepted: 422 Desc ...
- POJ3928 Ping pong
Time Limit: 1000MS Memory Limit: 65536KB 64bit IO Format: %lld & %llu Description N(3<= ...
- 【CF707B】Bakery(想法题)
题意: 有N个城市,M条无向边,其中有K个城市是仓库 现在要在非仓库的城市中选择一家开面包店,使得其最少与一个仓库联通,且到所有仓库距离的最小值最小 (1 ≤ n, m ≤ 10^5, 0 ≤ k ≤ ...
- 【MFC】MFC中使对话框变成圆角矩形的代码(转)
原文转自 http://blog.csdn.net/cracent/article/details/48274469 BOOL CLoginDlg::OnInitDialog() { CDialog: ...
- Group by 两表联查取另一表与之关联数据的总数
使用group by 需要查询的字段 必须要放在group by 后面 SELECT U.UserLotterySn,count(W.Userlotterysn) as WinCount,U.Acti ...
- Tyvj——P1864 [Poetize I]守卫者的挑战
来源:http://www.tyvj.cn/p/1864 描述 打开了黑魔法师Vani的大门,队员们在迷宫般的路上漫无目的地搜寻着关押applepi的监狱的所在地.突然,眼前一道亮光闪过.“我,Niz ...