vue項目打包后,將文件復(fù)制到服務(wù)器顯然是很麻煩，于是結(jié)合網(wǎng)上的資料，寫下這篇自動化部署的記錄。

一、安裝 scp2

npm install scp2 --save-dev

二、寫好腳本

例如 upload.js （下面任選一個即可）

位置和 package.json平級即可。

簡略版

'use strict'
// 引入scp2
var client = require('scp2');

client.scp('./dist/', {    // 本地打包文件的位置
  "host": 'XXX.XX.XX.XXX', // 服務(wù)器的IP地址
  "port": 'XX',            // 服務(wù)器端口， 一般為 22
  "username": 'XXX',       // 用戶名
  "password": '*****',     // 密碼
  "path": 'XXX'            // 項目部署的服務(wù)器目標(biāo)位置
}, err =>{
  if (!err) {
    console.log("項目發(fā)布完畢!")
  } else {
    console.log("err", err)
  }
})

稍微美化下控制臺的輸出

'use strict'
// 引入scp2
var client = require('scp2');
// 下面三個插件是部署的時候控制臺美化所用 可有可無
const ora = require('ora');
const chalk = require('chalk');
const spinner = ora(chalk.green('正在發(fā)布到服務(wù)器...'));
spinner.start();

client.scp('./dist/', {    // 本地打包文件的位置
  "host": 'XXX.XX.XX.XXX', // 服務(wù)器的IP地址
  "port": 'XX',            // 服務(wù)器端口， 一般為 22
  "username": 'XXX',       // 用戶名
  "password": '*****',     // 密碼
  "path": 'XXX'            // 項目部署的服務(wù)器目標(biāo)位置
}, err =>{
  spinner.stop();
  if (!err) {
    console.log(chalk.green("項目發(fā)布完畢!"))
  } else {
    console.log("err", err)
  }
})

?記得項目git上傳時忽略此文件, 因為這里面包含了你的服務(wù)器地址、用戶以及密碼

三、在 package.json 中添加 scripts 命令

"upload": "node upload.js",
"deploy": "npm run build && npm run upload"

四、執(zhí)行腳本

npm run deploy

運(yùn)行這個腳本命令之后，它會先npm run build執(zhí)行打包命令，然后，執(zhí)行 node upload.js,將打包的文件上傳到服務(wù)器

五、結(jié)果

這時候項目已經(jīng)打包完成了

六、其他

看網(wǎng)上有更加好的腳本，分為測試網(wǎng)和現(xiàn)網(wǎng)。比如這篇文章：

[Vue-CLI 3.x 自動部署項目至服務(wù)器](https://www.cnblogs.com/nxmin...