前端项目打包+自动压缩打包文件+自动上传部署远程服务器

• mac命令 .sh文件格式

#!/bin/bashecho "🚀 开始构建**系统..."# 清理之前的构建文件
echo "🧹 清理之前的构建文件..."
if [ -d "dist" ]; thenrm -rf distecho "✅ 已删除旧的 dist 目录"
fi# 删除之前的压缩文件
if [ -f "dist.zip" ]; thenrm -f dist.zipecho "✅ 已删除旧的压缩文件"
fi# 执行构建
echo "📦 开始执行 npm run build..."
npm run build# 检查构建是否成功
if [ $? -eq 0 ]; thenecho "✅ 构建成功完成！"# 检查 dist 目录是否存在if [ -d "dist" ]; thenecho "📊 构建结果统计："echo "   - 构建目录: $(pwd)/dist"echo "   - 文件数量: $(find dist -type f | wc -l)"echo "   - 目录大小: $(du -sh dist | cut -f1)"# 创建压缩文件echo "🗜️  开始压缩 dist 目录..."# 压缩文件zip -r "dist.zip" dist/ -x "*.DS_Store" "*/.*"if [ $? -eq 0 ]; thenecho "✅ 压缩完成！"echo "📦 压缩文件信息："echo "   - 文件名: dist.zip"echo "   - 文件大小: $(du -sh "dist.zip" | cut -f1)"echo "   - 文件路径: $(pwd)/dist.zip"elseecho "❌ 压缩失败！"exit 1fielseecho "❌ 构建失败：dist 目录不存在！"exit 1fi
elseecho "❌ npm run build 执行失败！"exit 1
fiecho ""
echo "🎉 构建和压缩流程完成！"
echo ""
echo "📁 输出文件："
echo "   - 构建目录: ./dist/"
echo "   - 压缩文件: ./dist.zip"
echo ""
echo "🚀 部署提示："
echo "   1. 可以直接使用 dist/ 目录进行部署"
echo "   2. 或者上传压缩文件 dist.zip 到服务器后解压"
echo ""

• windows命令 .bat文件格式

@echo off
chcp 65001 >nulecho 🚀 开始**系统...REM 清理之前的构建文件
echo 🧹 清理之前的构建文件...
if exist "dist" (rmdir /s /q "dist"echo ✅ 已删除旧的 dist 目录
)REM 删除之前的压缩文件
if exist "dist.zip" (del /q "dist.zip"echo ✅ 已删除旧的压缩文件
)REM 执行构建
echo 📦 开始执行 npm run build...
call npm run buildREM 检查构建是否成功
if %errorlevel% equ 0 (echo ✅ 构建成功完成！REM 检查 dist 目录是否存在if exist "dist" (echo 📊 构建结果统计：echo    - 构建目录: %cd%\distREM 创建压缩文件echo 🗜️  开始压缩 dist 目录...REM 使用PowerShell进行压缩powershell -command "Compress-Archive -Path 'dist\*' -DestinationPath 'dist.zip' -Force"if !errorlevel! equ 0 (echo ✅ 压缩完成！echo 📦 压缩文件信息：echo    - 文件名: dist.zipecho    - 文件路径: %cd%\dist.zip) else (echo ❌ 压缩失败！exit /b 1)) else (echo ❌ 构建失败：dist 目录不存在！exit /b 1)
) else (echo ❌ npm run build 执行失败！exit /b 1
)echo.
echo 🎉 构建和压缩流程完成！
echo.
echo 📁 输出文件：
echo    - 构建目录: .\dist\
echo    - 压缩文件: .\dist.zip
echo.
echo 🚀 部署提示：
echo    1. 可以直接使用 dist\ 目录进行部署
echo    2. 或者上传压缩文件 dist.zip 到服务器后解压
echo.pause```