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",
"description": "description",
"main": "gulpfile.js",
"dependencies": {
"gulp": "^3.9.0",
"gulp-rename": "^1.2.2",
"gulp-jshint": "^1.11.2",
"gulp-concat": "^2.6.0",
"gulp-uglify": "^1.4.0",
"gulp-util": "^1.0.0"
},
"devDependencies": {
"gulp": "^3.9.0"
},
"scripts": {
"test": "test command"
},
"repository": {
"type": "git",
"url": "git repository"
},
"keywords": [
"keywords"
],
"author": "author",
"license": "ISC"
}
4.安装相关的依赖
cnpm install
5.创建gulpfile.js,内容如下
var gulp = require('gulp');
var gutil = require('gulp-util');
var uglify = require('gulp-uglify');
var concat = require('gulp-concat');
gulp.task('concat', function () {
gulp.src('./src/*.js')
.pipe(uglify())
.pipe(concat('all.min.js'))
.pipe(gulp.dest('./build'));
});
gulp.task('default', ['concat']);
6.执行gulp,将看到以下结果


gulp之demo的更多相关文章
- 使用gulp来构建一个前端项目
什么是gulp? gulp是一个前端项目构建工具,是自动化项目的构建利器,它不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成.你可以使用gulp及其插件对你的项目代码 ...
- 给资源文件添加指纹(Gulp版)
至于为什么要费尽心思地给文件添加指纹,请参看前端静态资源缓存控制策略.这次要达到的小目标就是生成的资源文件能够被客户端缓存,而在文件内容变化后,能够请求到最新的文件. 需要用到的 gulp 插件是 g ...
- gulp 入门使用
gulp 入门使用 使用场景 相信大家在传统的开发模式下 都是 html + css + js 然后静态文件不经过任何处理 部署到服务器,这样会有很多漏洞例如: 1.在网站上查看F12 就可以看到 ...
- gulp前端工程化教程
gulp npm install -g gulp-concat 文件打包 npm install -g gulp-rename 文件重命名 npm install -g gulp-imagemin 图 ...
- 一篇迟到的gulp文章,代码合并压缩,less编译
前言 这篇文章本应该在去年17年写的,但因为种种原因没有写,其实主要是因为懒(捂脸).gulp出来的时间已经很早了,16年的时候还很流行,到17年就被webpack 碾压下去了,不过由于本人接触gul ...
- Gulp实例(包括环境搭建的自动检测)
# Gulp实例(包括环境搭建的自动检测) Gulp是一个自动化构建工具,开发者可以使用它在项目开发过程中自动执行常见任务.下面我将完成如下的功能点并且附上源码: CSS文件打包 less文件打包 s ...
- 写GULP遇到的ES6问题详解
Gulp.js 是一个自动化构建工具,开发者可以使用它在项目开发过程中自动执行常见任务.最近复习一下gulp一些基本的写法,在写了一些简单的uglify,rename,concat,clean的处理之 ...
- AngularJs--angular-pagination可复用的分页指令
1.angular-pagination 是基于angular 编写的可复用分页指令 安装 克隆项目到本地: git clone https://github.com/febobo/angular-p ...
- gulp-prompt入个了门
gulp-prompt版本:0.4.1 源码:gulp-prompt 一.gulp-prompt的简介 gulp-prompt 是一个基于gulp的命令行提示. 我们可以用它来完成命令行中互动功能. ...
随机推荐
- java实现第六届蓝桥杯表格计算
表格计算 某次无聊中, atm 发现了一个很老的程序.这个程序的功能类似于 Excel ,它对一个表格进行操作. 不妨设表格有 n 行,每行有 m 个格子. 每个格子的内容可以是一个正整数,也可以是一 ...
- Linux 递归acl权限和默认acl权限
递归acl权限 递归acl指给父目录设定acl时,所有的子文件和子目录都拥有相同的acl权限 setfacl -m u:boduo:rx -R /project/ 默认acl权限 默认acl权限的作用 ...
- React 为什么要把事件挂载到 document 上 & 事件机制源码分析
前言 我们都知道 React 组件绑定事件的本质是代理到 document 上,然而面试被问到,为什么要这么设计,有什么好处吗? 我知道肯定不会是因为虚拟 DOM 的原因,因为 Vue 的事件就能挂载 ...
- 如何在Linux上安装Redis(内附详细教程)
前言 hello,好久不见,又断更了一段时间.同事大部分离职了,但是活还是一样,所以只能硬着头皮顶上.现在总算歇会了,决定开启Redis源码系列,希望不要啪啪啪打脸. 什么是redis? Redi ...
- Java 入门教程
Java 入门教程 Java 是由Sun Microsystems公司于1995年5月推出的高级程序设计语言. Java可运行于多个平台,如Windows, Mac OS,及其他多种UNIX版本的系统 ...
- [C#.NET 拾遗补漏]05:操作符的几个骚操作
阅读本文大概需要 1.5 分钟. 大家好,这是极客精神[C#.NET 拾遗补漏]专辑的第 5 篇文章,今天要讲的内容是操作符. 操作符的英文是 Operator,在数值计算中习惯性的被叫作运算符,所以 ...
- Spring:扫描组件
<context:component-scan>:扫描组件,对设置的包下面的类进行扫描,会讲加上注解的类作为Spring的组件进行加载 组件:指Spring中管理的bean 作为Spr ...
- 【asp.net core 系列】9 实战之 UnitOfWork以及自定义代码生成
0. 前言 在前一篇中我们创建了一个基于EF的数据查询接口实现基类,这一篇我将带领大家讲一下为这EF补充一些功能,并且提供一个解决避免写大量配置类的方案. 1. SaveChanges的外移 在之前介 ...
- LR字符串处理函数-lr_save_int
int lr_save_int(int value,const char * param_name); value:要分配给参数的整数值. param_name:参数的名称. lr_save_in ...
- php读取富文本处理html标签问题
thinkphp的一项配置会将富文本编辑器的内容中的html标签进行转义处理 'DEFAULT_FILTER' => 'htmlspecialchars', // 默认参数过滤方法使用htmls ...