npm run build之后,將dist文件夾自動壓縮,通過ssh自動連接服務器,把壓縮包放到指定目錄下,然后自動解壓
根目錄創建gulpfile.js文件
const gulp = require('gulp');
const GulpSSH = require('gulp-ssh');
const archiver = require('archiver');
const fs = require('fs');
const path = require('path');
const { exec } = require('child_process');
// 文件路徑
const prodWebPath = "/www/wwwroot/test.new.ssss.cn/public";
// 服務器配置
const gulpSSHProd = new GulpSSH({ignoreErrors: false,sshConfig: {host: "112.12.126.59",username: "root",password: "mlztgc",}
});const zipFileName = 'dist.zip';
const zipFilePath = path.join(process.cwd(), zipFileName);// 1. 壓縮 dist 文件夾
gulp.task('compress', (done) => {const output = fs.createWriteStream(zipFilePath);const archive = archiver('zip', { zlib: { level: 9 } });output.on('close', done);archive.on('error', done);archive.pipe(output);archive.directory('dist/', false);archive.finalize();
});// 2. 上傳壓縮包到服務器
// 2. 上傳壓縮包到服務器
gulp.task('upload', (done) => {exec(`scp ${zipFilePath} root@112.12.126.59:/${prodWebPath}/dist.zip`, (err, stdout, stderr) => {if (err) {console.error('SCP 上傳失敗:', err, stderr);done(err);} else {console.log('SCP 上傳成功:', stdout);done();}});});// // 3. 遠程解壓
gulp.task('extract', () => {const cmd = [`cd ${prodWebPath}`,'unzip -o /tmp/dist.zip','rm -f /tmp/dist.zip'].join(' && ');return gulpSSHProd.exec(cmd, { filePath: 'extract.log' });
});// // 4. 刪除本地壓縮包
gulp.task('clean', (done) => {if (fs.existsSync(zipFilePath)) fs.unlinkSync(zipFilePath);done();
});// 一鍵部署
gulp.task('deploy', gulp.series('compress', 'upload','extract','clean'));
安裝依賴
npm install gulp?gulp-ssh --save
npm install?archiver
修改打包命令 package.json
"build": "vue-cli-service build && gulp deploy",
第一次連接需要輸入 yes,后面打包就只需要輸入密碼就可上傳解壓