gulp教程之gulp-less gulp详细入门教程 11.1.安装nodejs: 11.2.新建package.json文件:cnpm init 11.3.全局和本地安装gulp: cnpm install gulp -g.cnpm install gulp --save-dev 11.4.安装gulp插件:cnpm install gulp-less --save-dev 11.5.新建gulpfile.js文件: 11.6.通过命令提示符运行gulp任务.gulp ...…

在这之前,我已经分享过一个webpack的全系列,相对于webpack, gulp使用和配置起来非常的简单. gulp是什么? gulp 是基于 node 实现 Web 前端自动化开发的工具,利用它能够极大的提高开发效率.在 Web 前端开发工作中有很多"重复工作",比如压缩CSS/JS文件.而这些工作都是有规律的.找到这些规律,并编写 gulp 配置代码,让 gulp 自动执行这些"重复工作" 一.安装gulp与压缩js文件 命令:  npm install gu…

1. http://www.tuicool.com/articles/FJVNZf 2.http://www.ydcss.com/archives/18 3.手动创建package.json: 如:cnpm init;…

一.gulp简介     1.gulp是什么? gulp是前端开发过程中一种基于流的代码构建工具,是自动化项目的构建利器:它不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用它,不仅可以很愉快的编写代码,而且大大提高我们的工作效率. gulp是基于Nodejs的自动任务运行器, 它能自动化地完成 javascript.coffee.sass.less.html/image.css 等文件的测试.检查.合并.压缩.格式化.浏览器自动刷新.部署文件生成,并监听文…

1.首先需要安装node+npm(这里不再叙述,网上教程一大堆) 2.gulp全局安装:npm install -g gulp 3.cd进入到你的项目目录,这里使用demo文件夹为我的示例项目 4.在demo项目中新建dist和src两个文件夹,再在src文件夹下新建images,sass,js三个文件夹和index.html文件 5.命令行cd进入到项目根目录,在项目中安装gulp模块,npm install gulp 6.安装gulp相关需要模块 npm install gulp-util…

大家好,虽然在博客园注册了很长一段时间,但我还没在博客园写过博客,这是在博客园的第一篇博客,希望能养成每周写博客的好习惯 O(∩∩)O~~) 今天要聊得是gulp的一个实时刷新的插件gulp-livereload,它是一款能够自动刷新网页的插件,能够让你在编写网页的时候,不用再按浏览器的F5进行刷新.既然要聊gulp的插件,就必须要先要学会怎么使用gulp,还没学会使用gulp的同学,可以看那看一点写的gulp教程,建议先看这篇gulp详细入门教程,然后再看其他的.相信你看完之后对gulp会有一…

“1. 我为什么使用grunt: 2. 我为何放弃grunt转投gulp: 3. 我为何放弃gulp与grunt,转投npm scripts: 4. 我为何放弃前端” —— 司徒正美 前端(段子)界的发展突飞猛进,总感觉随时会跟不上技术潮流(其实我已经被甩开了一条街,so sad 选择在这样一个时机发布一篇 gulp 教程并不是我的初衷,第一次用 gulp 是在一年前,而这篇帖子在草稿箱里躺了一个多月,再不发出来说不定就过时了. 当我在用 gulp 时我用它做什么? 编译 sass 合并优化压缩…

当我们在使用gulp的时候,gulp到底用来干什么呢? 编译 sass 合并优化压缩 css 校验压缩 js 优化图片 添加文件指纹(md5) 组件化头部底部(include html) 实时自动刷新… ...... 压缩静态资源 变更静态资源 给静态资源添加 md5 修改预处理样式后自动编译(SASS,Less) 合并雪碧图 自动刷新浏览器 ...... Sass编译 Css Js 图片压缩 Css Js 合并 Css Js 内联 Html的include功能 Autoprefixer 自动刷…

Angular2.x与Angular1.x完全不同,Angular2.x是不兼容Angular1.x的,所在在框架的构造上,它们是完全不同的.在Angular2.x中,因为其是基于ES6来开发的,所以会有很多第三方依赖.由于很多浏览器还不支持ES6,所以Angular2引入了很多polyfill或者shim, 导致我们引入了第三方依赖. 官方的说法,它是基于数据流的构建系统(streaming build system),主要用来让自动化和增强你的工作流程(Automate and enhanc…

1. 更改变量名的几种方法<img src="https://pic4.zhimg.com/d93cf0e8987e0117f3a3187cfe8e53fb_b.jpg" data-rawwidth="153" data-rawheight="46" class="content_image" width="153">这种情况下该如何快速选中正确的内容?第一种方法:让 Cmd-D…