在开发 NPM 包项目中,需要压缩并且格式化源码,我们可以写一个脚本去处理。
首先在项目下安装 uglify-js
,用于压缩 .js
文件:
npm i -D uglify-js
- 如果需要压缩、格式化其他类型的文件,比如 HTML,可以使用
html-minify
等工具。- 这里使用字段
-D
,这样uglify-ts
仅仅作为一个开发阶段依赖,不会用于生产环境。
假设你用 npm run build
脚本去构建 NPM 包项目,那么我们可以在 package.json#scripts
加上新的命令 postbuild
: "postbuild": "node ./fixup.js",
这是 NPM 官方提供的机制,
post
+your_scirpt
开头的命令会作为your_script
后置命令运行。
同时我们在项目下提供一个 fixup.js
的脚本:
import { readFile, writeFile, readdir } from 'node:fs/promises'
import { minify } from 'uglify-js'
// 获取文件夹下所有文件列表
async function getFilePathList(dirName) {
let files = []
const items = await readdir(dirName, { withFileTypes: true })
for (const item of items) {
if (item.isDirectory()) {
files = [...files, ...(await getFilePathList(`${dirName}/${item.name}`))]
} else {
files.push(`${dirName}/${item.name}`)
}
}
return files
}
console.log('[Get the files under ./dist]')
const filePathList = await getFilePathList('./dist')
console.log(filePathList)
if (!Array.isArray(filePathList)) throw new Error('Files format error.')
if (filePathList.length <= 0) throw new Error('Empty file.')
// 获取所有 .js 文件
console.log('[Get the .js files]')
const jsFilePathList = filePathList.filter((filePath) => /.js$/.test(filePath))
if (jsFilePathList.length <= 0) throw new Error("Can't find any .js files.")
console.log(jsFilePathList)
// 压缩 .js 文件
console.log('[Minify .js files]')
jsFilePathList.map(async (jsFilePath) => {
const sourceCode = await readFile(jsFilePath, {
encoding: 'utf-8',
})
const uglifiedCode = minify(sourceCode)
if (uglifiedCode.error) throw new Error(uglifiedCode.error)
await writeFile(jsFilePath, uglifiedCode.code, {
encoding: 'utf-8',
})
})
console.log('[Minify .js files successfully.]')
这段脚本主要是获取 ./dist
文件夹下的每一个 .js
文件,并且逐一压缩、格式化。