自动化部署介绍

翻阅了很多资料，终于完成了简单版的自动化部署，也搞明白了什么叫自动化部署。 首先，所谓的自动化部署，就是用node连接服务器，然后用命令行将文件传入服务器指定的文件夹下，就这么简单，下面就是我完成的方法

准备

先是一个初始化好的vue-cli

然后服务器是linux系统

所需环境是vue + nodejs

所需依赖ssh2-sftp-client

开始

安装依赖

npm i ssh2-sftp-client --save-dev

ssh2-sftp-client是一个用于node.js的SFTP客户端，一个用于SSH2的包装程序（提供高级便利抽象）以及一个基于Promise的API

这个插件安装到dev下面就好了，生产环境用不上

然后我们在根目录里新建一个deploy.js，我们将在这个js文件内编写代码

配置项：

import path from 'path'
import Client from "ssh2-sftp-client";

const config = {
  ip: 'xxxxxx', // ssh地址 例如41.143.160.222
  username: 'root', // ssh 用户名
  port: '22', // 端口默认22
  password: 'xxxx', // ssh 密码
  path: '/root/web/dist', // 操作开始文件夹 可以直接指向配置好的地址
  rmpath: '/root/web/dist' // 需要删除的文件夹
}

代码逻辑

function connectSSh() {
  let sftp = new Client()
  sftp.connect({
    host: config.ip,
    port: config.port,
    username: config.username,
    password: config.password
  })
    .then(async () => {
      console.log('删除旧文件')
      await sftp.rmdir(config.rmpath, true)
      console.log('删除成功')
    })
    .then(async () => {
      console.log('更新文件')
      await sftp.uploadDir(path.resolve('./dist'), config.path)
    })
    .then(() => {
      console.log('上传完成')
      sftp.end()
    }).catch((err) => {
      console.log(err, '失败')
      sftp.end()
    })
}
// 执行
connectSSh()

添加npm指令

我们可以在原有的打包指令的基础上在加一条叫buildupdate， 我们可以把原有的打包指令复制过来，再后面加上node ./deploy.js

完整就是：

"scripts": {
    "dev": "vite",
    "build": "vue-tsc --noEmit && vite build",
    "preview": "vite preview",
    "buildupdate": "vue-tsc --noEmit && vite build && node ./deploy.js"
  },

我是用vite初始化的脚手架，使用webpack也是一样

参考： blog.csdn.net/qq_32849999…