vite-plugin-build-console

一个用于在构建过程中输出构建信息的Vite插件

📖 简介

vite-plugin-build-console 是一个Vite插件，用于在构建过程中输出有用的信息，如环境变量、构建时间、包体积等。同时，它还可以将构建产物打包成zip文件，方便传输和部署。

打包 + 打包完成后压缩dist的内容并且命名。

增加环境变量的输出可以用于查看指向的后端API地址。

✨ 特性

特性	状态	描述
📊 构建信息输出	✅	打包时打印环境变量等信息
🕒 构建时间统计	✅	显示构建所用时间
📦 包体积计算	✅	计算并显示构建产物的大小
🌐 环境变量显示	✅	显示.env文件中的环境变量
📎 ZIP打包	✅	打包完成后添加到zip包方便传输

✅ 已完成   🚧 开发中

📦 安装

# npm
npm install vite-plugin-build-console -D

# yarn
yarn add vite-plugin-build-console -D

# pnpm
pnpm add vite-plugin-build-console -D

🚀 使用

在你的 vite.config.ts 文件中添加插件：

// vite.config.ts
import { defineConfig } from 'vite'
import { consoleBuildInfo } from 'vite-plugin-build-console'

export default defineConfig({
  plugins: [
    consoleBuildInfo({
      // 配置选项
      envString: ['VITE_API_URL', 'VITE_APP_VERSION'] // 指定要显示的环境变量
    })
  ],
  build: {  // 指定计算大小和zip压缩的目标path
    outDir: 'dist'
  }
})

⚙️ 配置选项

选项	类型	默认值	描述
envString	string[]	[]	指定要显示的环境变量列表，如果不指定则显示所有环境变量

📝 示例

构建完成后，控制台将输出类似以下内容：

┌────────────────────────────────────────────────────┐
│                                                    │
│        🎉 打包完成（用时00分05秒，包体积：2.5MB）      │
│        outDir:dist                                 │
│        VITE_API_URL: https://api.example.com       │
│        VITE_APP_VERSION: 1.0.0                     │
│                                                    │
└────────────────────────────────────────────────────┘

🤝 贡献

欢迎提交问题和功能请求！也欢迎提交PR。

📄 许可证

MIT License.