【gulp之demo】的更多相关文章

gulp之demo

1.安装gulp cnpm install -g gulp; 2.然后还需要在当前目录安装gulp,具体不详,只知道安装了之后会在当前目录下的node_modules下多一个gulp文件夹 cnpm install gulp --save-dev 有哪位大神知道的还望指导 3.创建package.json,可以cnpm init或者自己手动写,内容如下 { "name": "gulptest", "version": "1.0.0&qu…

使用gulp来构建一个前端项目

什么是gulp? gulp是一个前端项目构建工具,是自动化项目的构建利器,它不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成.你可以使用gulp及其插件对你的项目代码(less,sass)进行编译,还可以压缩你的js和css代码,甚至压缩你的图片等等. 我看了很多网上的资料,目前最流行的两种使用JavaScript开发的构建工具是Grunt和Gulp.而grunt多用在文件较多,逻辑复杂的项目构建,如果只是用来管理小项目的话,gulp方便快捷,是最适合不过的了.…

给资源文件添加指纹（Gulp版）

至于为什么要费尽心思地给文件添加指纹,请参看前端静态资源缓存控制策略.这次要达到的小目标就是生成的资源文件能够被客户端缓存,而在文件内容变化后,能够请求到最新的文件. 需要用到的 gulp 插件是 gulp-rev2 ,看清楚了,不是 gulp-rev + gulp-rev-collector 的蹩脚组合,而是 gulp-rev2. gulp-rev2 的设计思路: 根据文件的内容 file.contents 生成文件指纹(hash值): 根据前面生成的文件指纹集合成一张(源文件,构建文件)映射…

gulp 入门使用

  gulp 入门使用 使用场景 相信大家在传统的开发模式下 都是 html + css + js 然后静态文件不经过任何处理 部署到服务器,这样会有很多漏洞例如: 1.在网站上查看F12 就可以看到源代码(可以篡改提交参数) 2.代码高级语法不经过babel转换,导致低版本浏览器无法正常解析 3.代码不压缩导致文件过大 等等等等.... 复制代码 webpack 和 gulp 区别 gulp:强调的是前端开发的流程,通过配置一系列的task,定义task处理的事物(例如文件压缩合并.雪碧图.启…

gulp前端工程化教程

gulp npm install -g gulp-concat 文件打包 npm install -g gulp-rename 文件重命名 npm install -g gulp-imagemin 图片压缩 npm install -g gulp-jslint js代码校验 慎用 npm install -g gulp-minify-css css压缩 npm install -g gulp-minify-html html压缩 npm install -g gulp-uglify js压缩 它…

一篇迟到的gulp文章，代码合并压缩，less编译

前言 这篇文章本应该在去年17年写的,但因为种种原因没有写,其实主要是因为懒(捂脸).gulp出来的时间已经很早了,16年的时候还很流行,到17年就被webpack 碾压下去了,不过由于本人接触gulp的时候比较晚,16年的时候才听说有这么个玩意,正真用它是在17年的时候,但是虽然现在webpack已经大行其道,我们每个人都 在积极去拥抱它,不过gulp在现在来说也并不是一无是处,还是有用到的地方,所以,这篇文章我觉得还有有必要写的,就当做是为gulp写的最后一篇文章吧 ,做技术就是 这么辛苦,…

Gulp实例（包括环境搭建的自动检测）

# Gulp实例(包括环境搭建的自动检测) Gulp是一个自动化构建工具,开发者可以使用它在项目开发过程中自动执行常见任务.下面我将完成如下的功能点并且附上源码: CSS文件打包 less文件打包 sass文件打包 JavaScript文件打包 图片文件打包 具体的实例请点击一下链接前往 github 进行下载: Gulp GitHub demo实例下载 1. 创建 package.json 文件(使用 cnpm init 命令行) 生成的package.json代码如下所示: 注意:我将ent…

写GULP遇到的ES6问题详解

Gulp.js 是一个自动化构建工具,开发者可以使用它在项目开发过程中自动执行常见任务.最近复习一下gulp一些基本的写法,在写了一些简单的uglify,rename,concat,clean的处理之后,发现都还记得这些基本语法. 然后无意间就想在demo中写下export function会变成怎样,结果发现gulp并不支持直接的es6语法,而且提示的错误也让人模棱两可. events.js:182 throw er; // Unhandled 'error' event ^ GulpUgli…

AngularJs--angular-pagination可复用的分页指令

1.angular-pagination 是基于angular 编写的可复用分页指令 安装 克隆项目到本地: git clone https://github.com/febobo/angular-pagination.git 要跑demo环境要求: node , bower , npm , gulp 安装: npm install && bower install 运行: gulp serve demo用法 html <body ng-app="demo" ng…

gulp-prompt入个了门

gulp-prompt版本:0.4.1 源码:gulp-prompt 一.gulp-prompt的简介 gulp-prompt 是一个基于gulp的命令行提示. 我们可以用它来完成命令行中互动功能. 二.gulp-prompt的使用 1.confirm([options]) 第一种使用: confirm中没填入任何值的时候,默认显示Are you sure? gulp.src('demo.js') .pipe(prompt.confirm()) .pipe(gulp.dest('dest'));…