gulp压缩js

1、安装nodejs -> 全局安装gulp -> 项目安装gulp以及gulp插件 -> 配置gulpfile.js -> 运行任务

2、查看nodejs的版本号

3、npm的版本号

4、定位目标

5、全局安装gulp

6、新建package.json文件

多了两个文件

7、本地安装gulp插件

8、新建gulpfile.js文件(重要)

var gulp = require(‘gulp‘),

uglify = require(‘gulp-uglify‘);

gulp.task(‘jsmin‘, function () {

gulp.src(‘src/js/index.js‘)

.pipe(uglify())

.pipe(gulp.dest(‘dist/js‘));

});

时间: 2024-10-08 15:12:56

gulp压缩js的相关文章

使用gulp压缩js详细步骤笔记

先要安装nodejs,初始化项目配置文件package.json,根据情况输入配置参数 npm init 1 test command: 2 git repository: 3 keywords: 4 author: 5 license: (ISC) 6 About to write to E:\temp\20170429\test03\package.json: 7 8 { 9 "name": "test03", 10 "version": &

使用 gulp 压缩 CSS

请务必理解如下章节后阅读此章节: 安装 Node 和 gulp 使用 gulp 压缩 JS 压缩 css 代码可降低 css 文件大小,提高页面打开速度. 我们接着将规律转换为 gulp 代码 规律 找到 css/ 目录下的所有 css 文件,压缩它们,将压缩后的文件存放在 dist/css/ 目录下. gulp 代码 当熟悉 使用 gulp 压缩 JS的方法后,配置压缩 CSS 的 gulp 代码就变得很轻松. 一.安装 gulp-minify-css 模块 提示:你需要使用命令行的 cd 切

使用 gulp 压缩图片

请务必理解如下章节后阅读此章节: 安装 Node 和 gulp 使用 gulp 压缩 JS 压缩 图片文件可降低文件大小,提高图片加载速度. 找到规律转换为 gulp 代码 规律 找到 images/ 目录下的所有文件,压缩它们,将压缩后的文件存放在 dist/images/ 目录下. gulp 代码 一.安装 gulp-imagemin 模块 提示:你需要使用命令行的 cd 切换至对应目录再进行安装操作和 gulp 启动操作. 在命令行输入 npm install gulp-imagemin

利用Node 搭配uglify-js压缩js文件,批量下载图片到本地

Node的便民技巧-- 压缩代码 下载图片 压缩代码 相信很多前端的同学都会在上线前压缩JS代码,现在的Gulp Webpack Grunt......都能轻松实现.但问题来了,这些都不会,难道就要面对几十个JS文件一遍遍来回“复制-压缩-创建-粘贴”,这样太不人性化了. 于是可以借助Node + uglify-js 轻松实现.(前提你会点node操作) 1.首先看一下目录: |--uglifyJS |--js |--test1.js |--test2.js |--uglify.js   //这

gulp压缩构建代码

// 获取 gulp var gulp = require('gulp'); // 获取 uglify 模块(用于压缩 JS) var uglify = require('gulp-uglify'); // 获取 htmlminify 模块(用于压缩 html) var htmlminify = require("gulp-html-minify"); // 获取 minify-css 模块(用于压缩 CSS) var minifyCSS = require('gulp-minify-

如何使用grunt压缩js文件

jQuery在使用grunt,bootstrap在使用grunt,百度UEditor在使用grunt,你没有理由不学.不用! 1. 前言 各位web前端开发人员,如果你现在还不知道grunt或者听说过.但是不会熟练使用grunt,那你就真的真的真的out了(三个“真的”重复,表 示重点).至于grunt的作用,这里不详细说了,总之你如果做web前端开发,你一定要用grunt.还有一点,它完全免费,没有盗版.既强大又免费的 东西,为何不用? 当然了,你如果你能找到更好的替代grunt的其他工具也是

gulp 入门---使用gulp压缩css

压缩 css 代码可降低 css 文件大小,提高页面打开速度. 规律转换为 gulp 代码 找到 css/ 目录下的所有 css 文件,压缩它们,将压缩后的文件存放在 dist/css/ 目录下. gulp 代码 一.安装 gulp-minify-css 模块 提示:你需要使用命令行的 cd 切换到对应目录后进行安装操作. 在命令行输入 sudo npm install gulp-minify-css 二.创建 gulpfile.js 文件编写代码 在对应目录创建 gulpfile.js 文件并

前端自动化之路之gulp,node.js

随着现在前端技术的不断发展,和各个公司对前端项目开发更新速度的要求,前端自动化越来越受到大家的重视,之前传统的前端开发方式已经越来越不能满足开发的需求了,于是各种自动化工具随之产生了.而gulp就是其中一款非常强大的工具. 1.安装node.js:由于gulp是基于node.js的.所以首先需要安装node.js,node下载地址:http://nodejs.cn/download/ 安装比较简单.安装完成之后在cmd里输入:node -v 查看安装的node版本. npm -v  查看安装的n

gulp打包js/css时合并成一个文件时的顺序解决

1.可以使用插进gulp-order. 2.可以这样的写法: return gulp.src(['js/common.js','js/**/*.js']) .pipe(concat('build.js'))//合成到一个js .pipe(gulp.dest(buildBasePath+'js'))//输出到js目录 .pipe(uglify())//压缩js到一行 .pipe(concat('build.min.js'))//压缩后的js .pipe(gulp.dest(buildBasePat