IDEA Vue项目云服务器一键部署,项目打包、备份云文件、上传打包文件 三位一体流水线操作
1、新建配置文件 remote-backup-deploy.js 代码如下 替换掉自己服务器的ip,用户名,部署路径
const { execSync } = require('child_process');
const fs = require('fs');
const path = require('path');
const os = require('os');
// 配置信息
const config = {
server: '127.0.0.1', // 修改为你的服务器IP
user: 'root', // 修改为你的用户名
remotePath: '/data/data/data', // 修改为你的部署路径
port: 22, // 修改为你的部署路径
maxBackups: 50 // 最多保留的备份数量
};
console.log('🔍 检查远程服务器上的 dist 文件夹...');
try {
// Remote translation
// 检查远程是否存在 dist 文件夹
const checkCommand = `ssh ${config.user}@${config.server} "test -d ${config.remotePath}/dist && echo 'exists' || echo 'not exists'"`;
const result = execSync(checkCommand, { encoding: 'utf8' }).trim();
console.log('result',result);
if (result === 'exists') {
console.log('✅ 发现旧的 dist 文件夹,开始备份...');
// 生成备份名称:dist-YYYYMMDD-HHMMSS
const now = new Date();
const dateStr = now.getFullYear() +
String(now.getMonth() + 1).padStart(2, '0') +
String(now.getDate()).padStart(2, '0');
const timeStr = String(now.getHours()).padStart(2, '0') +
String(now.getMinutes()).padStart(2, '0') +
String(now.getSeconds()).padStart(2, '0');
const backupName = `dist-${dateStr}-${timeStr}`;
console.log(`📦 备份名称: ${backupName}`);
// 执行备份(重命名)
const backupCommand = `ssh ${config.user}@${config.server} "cd ${config.remotePath} && mv dist ${backupName}"`;
execSync(backupCommand, { stdio: 'inherit' });
console.log(`✅ 备份成功: ${config.remotePath}/${backupName}`);
// 清理旧备份(保留最近的 maxBackups 个)
// console.log('🧹 清理旧备份...');
// const cleanCommand = `ssh ${config.user}@${config.server} "cd ${config.remotePath} && ls -dt dist-* | tail -n +$((\$(ls -dt dist-* | wc -l) + 1)) | xargs -r rm -rf"`;
// execSync(cleanCommand, { stdio: 'inherit' });
console.log('✅ 旧备份清理完成');
} else {
console.log('ℹ️ 远程没有旧的 dist 文件夹,跳过备份');
}
console.log('✨ 备份流程完成,可以上传新的 dist 文件夹了');
console.log('📤 开始上传 dist 文件夹...');
const localDist = path.join(__dirname, 'dist');
// 检查 dist 目录是否存在
if (!fs.existsSync(localDist)) {
throw new Error('dist 文件夹不存在,请先运行 npm run build');
}
// 检测操作系统
const isWindows = os.platform() === 'win32';
let command;
if (isWindows) {
// Windows 使用 scp 命令
console.log('💻 检测到 Windows 系统,使用 scp 上传...');
// 将路径转换为 Unix 风格(scp 兼容)
const localPathUnix = localDist.replace(/\\/g, '/');
// 方式1: 使用 scp 递归复制整个文件夹
command = `scp -r ${localPathUnix}/* ${config.user}@${config.server}:${config.remotePath}/dist`;
// 方式2: 如果上面的不行,可以使用 pscp(PuTTY SCP)
// 需要先下载 pscp.exe: https://www.putty.org/
// command = `pscp -r ${localDist}\\* ${config.user}@${config.server}:${config.remotePath}/`;
} else {
// Linux/Mac 使用 rsync
console.log('💻 检测到 Unix 系统,使用 rsync 上传...');
command = `rsync -avz --delete ${localDist}/ ${config.user}@${config.server}:${config.remotePath}/dist`;
}
console.log(`执行命令: ${command}`);
execSync(command, { stdio: 'inherit' });
console.log('✅ 部署成功!');
console.log(`🌐 访问地址: http://${config.server}`);
} catch (error) {
console.error('❌ 备份或部署失败:', error.message);
process.exit(1);
}
2、在package.json文件中 的 scripts 中 加两个启动命令 之后直接执行 deploy 的话 就会打包文件并备份云文件 、上传新的打包文件
"deploy": "npm run build && node remote-backup-deploy.js", "deploy:nobuild": "node remote-backup-deploy.js"
3、最后一点是 在备份或上传文件时 ,总是让输入服务器密码,就很烦(不烦的可以不设置),下面是生成公钥并上传到 服务器上的命令。这些命令直接在windows本地终端就可以执行。
# 1. 生成密钥(如果还没有) 到 C:\Users\张三\.ssh 中,会有四个文件
ssh-keygen -t rsa -b 4096# 2. 复制公钥到服务器(只需输入一次密码) $env:USERPROFILE:Windows 环境变量,指向你的用户目录,.ssh\id_rsa.pub:SSH 公钥文件路径,云服务器上创建目录 ,上传公钥文件,设置权限。(注意修改用户名和ip)
type $env:USERPROFILE\.ssh\id_rsa.pub | ssh root@127.0.0.1 "mkdir -p ~/.ssh && cat >> ~/.ssh/authorized_keys && chmod 700 ~/.ssh && chmod 600 ~/.ssh/authorized_keys"
# 3. 测试免密登录
ssh root@127.0.0.1 "echo 成功!"# 4. 运行部署(应该不需要密码了)
npm run deploy
4、之后你就可以直接在项目中进行一键部署了。每次都得打开xftp ,找到目录,上传文件,烦死我了。
openEuler 是由开放原子开源基金会孵化的全场景开源操作系统项目,面向数字基础设施四大核心场景(服务器、云计算、边缘计算、嵌入式),全面支持 ARM、x86、RISC-V、loongArch、PowerPC、SW-64 等多样性计算架构
更多推荐
所有评论(0)