使用gulp压缩js详细步骤笔记
先要安装nodejs,初始化项目配置文件package.json,根据情况输入配置参数
npm init
test command:
git repository:
keywords:
author:
license: (ISC)
About to write to E:\temp\\test03\package.json: {
"name": "test03",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
npm init
安装gulp
npm install gulp -g (global环境) npm install gulp --save-dev (项目环境)
在项目中install需要的gulp插件,一般只压缩的话需要npm install gulp-minify-css gulp-concat gulp-uglify gulp-rename del --save-dev更多插件可以在这个链接中找到 http://gratimax.net/search-gulp-plugins/
在项目的根目录新建gulpfile.js,require需要的module
var gulp = require('gulp'),
uglify = require('gulp-uglify'); gulp.task("default",function()
{
gulp.src("src/*.js").pipe(uglify()).pipe(gulp.dest("dist/js"));
})
执行gulp命令进行js压缩
E:\temp\\test03>gulp
[::] Using gulpfile E:\temp\\test03\gulpfile.js
[::] Starting 'default'...
[::] Finished 'default' after ms
监控文件修改自动执行任务
gulp.task("file_change",function()
{
gulp.src("src/*.js").pipe(uglify()).pipe(gulp.dest("dist/js"));
console.log("uglifyed");
}) gulp.task("auto",function()
{
gulp.watch("src/*.js",["file_change"]);
})
执行gulp auto,文件修改是自动执行压缩任务
E:\temp\\test03>gulp auto
[::] Using gulpfile E:\temp\\test03\gulpfile.js
[::] Starting 'auto'...
[::] Finished 'auto' after ms
[::] Starting 'file_change'...
uglifyed
[::] Finished 'file_change' after ms
[::] Starting 'file_change'...
uglifyed
[::] Finished 'file_change' after 4.75 ms
[::] Starting 'file_change'...
uglifyed
使用gulp压缩js详细步骤笔记的更多相关文章
- 《Gulp 入门指南》 : 使用 gulp 压缩 JS
<Gulp 入门指南> : 使用 gulp 压缩 JS 请务必理解如下章节后阅读此章节: 安装 Node 和 gulp 访问论坛获取帮助 压缩 js 代码可降低 js 文件大小,提高页面打 ...
- 使用 gulp 压缩 JS
使用 gulp 压缩 JS 请务必理解如下章节后阅读此章节: 安装 Node 和 gulp 压缩 js 代码可降低 js 文件大小,提高页面打开速度.在不利用 gulp 时我们需要通过各种工具手动完成 ...
- gulp 压缩js,css
最近做的前端项目中发现引用的js包太多,导致页面加载时反应很慢,所以首先想到的是将js和css压缩,提高加载速度. 我们先来看看抓到的当前页面响应时间: 页面异步加载,需要响应时间 7.41秒,这也太 ...
- gulp 压缩 js 和 css 代码
我们在写出来的代码都是非常规范的,改换行的时候就换行,改tab 的时候就有tab,还有这样做是为了后期维护方便,但是这也导致了内存占用量的增大,当把把代码发到线上,如果网速慢一点,可能很久都加载不出来 ...
- gulp压缩js文件报错日志
输出 gulp-uglify 压缩js文件时报错信息 gulp.task('es6', function () { return gulp.src('src/main/webapp/bower_com ...
- gulp压缩js
1.安装nodejs -> 全局安装gulp -> 项目安装gulp以及gulp插件 -> 配置gulpfile.js -> 运行任务 2.查看nodejs的版本号 3.npm ...
- Gulp使用入门操作十一步压缩JS
前提需要安装nodejs 一. 全局安装Gulp npm install -g gulp 二.新建一个 gulpfile.js 文件 chapter2└── gulpfile.js 三.在 gulpf ...
- 使用 gulp 压缩 CSS
请务必理解如下章节后阅读此章节: 安装 Node 和 gulp 使用 gulp 压缩 JS 压缩 css 代码可降低 css 文件大小,提高页面打开速度. 我们接着将规律转换为 gulp 代码 规律 ...
- 使用 gulp 压缩图片
请务必理解如下章节后阅读此章节: 安装 Node 和 gulp 使用 gulp 压缩 JS 压缩 图片文件可降低文件大小,提高图片加载速度. 找到规律转换为 gulp 代码 规律 找到 images/ ...
随机推荐
- C# to IL 8 Methods(方法)
The code of a data type is implemented by a method, which is executed by the ExecutionEngine. The CL ...
- linux中和salt中的fqdn测试小节
设置hosts文件和hostname文件 [root@dawn-hnyd-yd-1 ~]# cat /etc/hosts 127.0.0.1 localhost localhost.localdoma ...
- 在HTML中导入外部的css
1,标签:<link type="text/css" rel="stylesheet" href="CSS样式文件的绝对地址"> ...
- kafka 学习资料
kafka 学习资料 kafka 学习资料 网址 kafka 中文教程 http://orchome.com/kafka/index
- learnopengl“入门”的全部代码
projection 里的角度,角度越大,物体离摄像机越远:角度越小,物体离摄像机越近,这个角度表示视野(fov),视野越大,看到的物体就越小 头文件 #ifndef SHADER_H_INCLUDE ...
- Elasticsearch(四)优化用户体验
改正用户拼写 Term suggester:词项匹配建议:可以通过wiki的插件来下载wiki上面的单词以及短语,来作为你的拼写提示基础仓库: Phrase suggester:n-gram算法,短语 ...
- jstat查看JVM统计信息
可以查看以下信息 [jdk基于1.8] 1.类装载 2.垃圾收集 3.JIT编译 一.类装载 返回参数的含义 二.垃圾收集 -gc的输出结果含义 JVM的内存结构 三.查看JIT编译 -compile ...
- ML: 聚类算法R包-K中心点聚类
K-medodis与K-means比较相似,但是K-medoids和K-means是有区别的,不一样的地方在于中心点的选取,在K-means中,我们将中心点取为当前cluster中所有数据点的平均值, ...
- innobackupex per table
#innobackupex export tableinnobackupex --defaults-file=/etc/my.cnf --sock=/data/3306/mysql_3306.sock ...
- VarIsOrdinal,VarIsFloat,VarIsNumeric判断数字
VarIsOrdinal VarIsFloat VarIsNumeric 就三个. 第一个 是否int,boolean 第二个 是否Double,Simple,Curren ...