本文章分三步讲解
第一步:安装需要的依赖
npm install scp2 --save-dev
npm install chalk --save-dev
npm install ssh2 --save-dev
npm install cross-env --save-dev
第二步:在vue项目根目录新建upload.server.js文件
upload.server.js
// 服务器配置信息
const server = {host: '192.168.0.230', // 服务器ipport: '22', // 端口一般默认22username: 'root', // 用户名password: 'hnjydpt@yunpan10', // 密码serverPath: '/home/project/frontend/', // 服务器路径(结尾加/)packageName: 'network-school-web', // 上传到服务器的位置localPath:'./network-school-web/' // 本地打包文件路径
}// 引入scp2
const client = require('scp2');
const ora = require('ora');
const spinner = ora('正在发布到服务器...');// 创建shell脚本
const Client = require('ssh2').Client;
const conn = new Client();console.log('正在建立连接');
conn.on('ready', function () {console.log('已连接')if(!server.packageName){console.log('连接已关闭');conn.end()return false;}// 这里我拼接了放置服务器资源目录的位置 ,首选通过rm -rf删除了这个目录下的文件conn.exec('rm -rf ' + server.serverPath + server.packageName + '/*', function (err, stream) {console.log('删除文件');stream.on('close', function (code, signal) {console.log('开始上传')spinner.start();client.scp(server.localPath, {"host": server.host,"port": server.port,"username": server.username,"password": server.password,"path": server.serverPath + server.packageName}, err => {spinner.stop();if (!err) {console.log('项目发布完毕');} else {console.log("err", err);}conn.end(); // 结束命令})}).on('data', function (data) {console.log('STDOUT: ' + data);}).stderr.on('data', function (data) {console.log('STDERR: ' + data);});})
}).connect({host: server.host,port: server.port,username: server.username,password: server.password// privateKey: '' // 使用密钥登录
});
第三步:在package.json中"scripts"节点新加执行方法
"scripts": {// 原有的测试包、正式包、等"serve": "vue-cli-service serve","build": "vue-cli-service build","test": "vue-cli-service build --mode test","build:docker": "vue-cli-service build --dest=./docker/dist/","lint": "vue-cli-service lint","analyze": "vue-cli-service build --report",// 补充的 "upload": "node upload.server.js", // 上传"publish": "npm run build:prod && npm run upload" // 打包并上传到服务器}
打包成功之后的结果