压缩、丑化/格式化你的 NPM 包项目

在开发 NPM 包项目中，需要压缩并且格式化源码，我们可以写一个脚本去处理。

首先在项目下安装 uglify-js，用于压缩 .js 文件：

npm i -D uglify-js

1. 如果需要压缩、格式化其他类型的文件，比如 HTML，可以使用 html-minify 等工具。
2. 这里使用字段 -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 文件，并且逐一压缩、格式化。