如何在Nuxt.js构建过程中压缩public目录下的embed.js文件？

完全可以实现，下面提供两种直接可行的方案，利用Nuxt的Nitro构建钩子对目标文件进行压缩/混淆：

方案一：使用esbuild快速压缩 #

esbuild是Nuxt内置依赖（无需额外安装也能使用，保险起见可手动执行npm install esbuild --save-dev），适合快速完成JS文件压缩：

在nuxt.config.ts中添加Nitro钩子配置：

import { defineNuxtConfig } from 'nuxt/config'
import { build } from 'esbuild'

export default defineNuxtConfig({
  nitro: {
    preset: 'firebase',
    hooks: {
      async 'nitro:build:public-assets'({ publicAssets }) {
        // 定位public目录下的embed.js文件
        const embedAsset = publicAssets.find(asset => asset.name === 'embed.js')
        if (embedAsset) {
          // 用esbuild压缩并覆盖输出文件
          await build({
            entryPoints: [embedAsset.src],
            outfile: embedAsset.dest,
            minify: true,
            bundle: false, // 若embed.js无外部依赖，保持false；需打包依赖则设为true
            platform: 'browser' // 适配浏览器运行环境
          })
        }
      }
    }
  }
})

方案二：使用terser实现深度混淆 #

如果需要更极致的代码混淆（如变量名替换、移除冗余代码），可以使用terser工具：

1. 先安装依赖：

npm install terser --save-dev

2. 在nuxt.config.ts中配置钩子：

import { defineNuxtConfig } from 'nuxt/config'
import { minify } from 'terser'
import fs from 'fs/promises'

export default defineNuxtConfig({
  nitro: {
    preset: 'firebase',
    hooks: {
      async 'nitro:build:public-assets'({ publicAssets }) {
        const embedAsset = publicAssets.find(asset => asset.name === 'embed.js')
        if (embedAsset) {
          const originalCode = await fs.readFile(embedAsset.src, 'utf8')
          // 执行混淆压缩
          const minifiedResult = await minify(originalCode, {
            mangle: true, // 开启变量名混淆
            compress: {
              drop_console: true, // 可选：移除console语句
              dead_code: true // 移除未被使用的冗余代码
            }
          })
          // 将压缩后的内容写入输出文件
          await fs.writeFile(embedAsset.dest, minifiedResult.code as string)
        }
      }
    }
  }
})

验证方法 #

执行npm run build后，查看.output/public/embed.js文件：若文件体积缩小、代码格式被压缩/混淆，则说明配置生效。

内容的提问来源于stack exchange，提问作者Myk Willis