使用 gulp 来写一个压缩 js 的小工具

使用 gulp 压缩 js 文件

初始化项目

1
npm init -y

安装依赖包

1
npm i gulp gulp-uflify gulp-rename gulp-notify

编写gulpfile.js文件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
const gulp = require("gulp")
const uglify = require("gulp-uglify")
const rename = require("gulp-rename")
const notify = require("gulp-notify")

// 压缩js代码
function minjs() {
return gulp
.src("js/*.js")
.pipe(uglify({ mangle: true, compress: true }))
.pipe(rename({ extname: ".min.js" }))
.pipe(gulp.dest("dist/js"))
.pipe(notify({ message: "压缩完成" }))
}

module.exports = { minjs }

更新 package.json script 脚本

1
2
3
"scripts": {
"minjs": "gulp"
}

使用方式:

  1. 在项目根目录下创建 js 文件夹(需要压缩的文件需要放到此文件夹内)
  2. 使用命令行输入 gulp minjs。运行成功后会在 dist/js 文件夹中生成压缩好的 js 代码并有系统级的提示
命令行
  • gulp-uflify 包用于压缩 js 代码
  • gulp-rename 用于给压缩后的文件重新命名
  • gulp-notify 用于压缩好后进行提示(系统级提示)