Skip to content

自动化压缩文件

自动化压缩文件,其实就是指定某个目录,通过 node 方式将其进行打包成 .zip

设计初衷

在平时的项目部署环节中,通常都是使用 gulp 实现自动化部署项目,将打包的文件夹里所有文件直接发送到服务器上,无需进行打压缩包。不过有些项目并非自动化部署,还是依然保持手动打成压缩包,然后将压缩包的名称改成项目名称 + 打包日期,最后在发送给其他同事部署,这个时候自动化压缩文件功能就起到效果了。

实现目标

执行命令 npm run zip 后,将 dist 目录下所有文件打成压缩包。

压缩包命名格式:dist-202405100905.zip

实现代码

使用前请使用 NPM 或者 YARN 安装插件。

sh
yarn add dayjs archiver
js
const dayjs = require('dayjs')
const fs = require('fs')
const archiver = require('archiver')

/**
 * 创建一个输出流,指向要生成的Zip文件
 * 设置压缩级别为 9
 */
const output = fs.createWriteStream(
    `dist-${dayjs().format('YYYYMMDDHHMM')}.zip`
)
const archive = archiver('zip', {
    zlib: { level: 9 }
})

/**
 * 监听压缩完成时,输出压缩成功信息
 */
output.on('close', () => {
    console.log(archive.pointer() + ' total bytes')
    console.log('压缩完成')
})

/**
 * 监听压缩出现错误时,输出错误信息
 */
archive.on('error', (err) => {
    throw err
})

/**
 * 将压缩流和输出流管道连接起来
 */
archive.pipe(output)

/**
 * 设置要压缩的目录为 ./dist
 * 第二个参数为 false,表示打包后不包含 dist 根目录
 */
archive.directory('./dist', false)

/**
 * 开始压缩
 */
archive.finalize()
json
{
    "dependencies": {
        "archiver": "^7.0.1",
        "dayjs": "^1.11.11"
    },
    "scripts": {
        "zip": "node index.js"
    }
}

结合 build 之后执行压缩

通常项目都是会先进行 npm run build 进行打包,打包之后在执行 npm run zip 打压缩包。这样就会有两次的操作,并且还要等待打包完成。所以可以通过下方代码进行优化,只需要执行一次即可。

json
{
    "scripts": {
        "build": "vite build --base=./ ",
        "zip": "node index.js",
        "postbuild": "npm run zip"
    }
}

postbuild 钩子,会在 npm run build 执行完之后执行。