没有CICD,怎么自动化部署?

不久前写了一个全新项目,包括服务器也是新的,所以没有CICD流水线

写完项目需要自己部署更新到服务器上

一开始是直接build,再用XshellXftp连接服务器手动替换文件来实现更新部署

但是这样不仅容易替换错,还耗时耗力

所以想着自己弄一个简单的自动化部署SSH

主要是通过 node-ssh 进行 SSH 连接并执行命令,上传文件夹,完成部署工作。下面来逐步解析,并说明 SSH 的使用。

1. 引入相关模块

javascript 复制代码
import { NodeSSH } from 'node-ssh';
import { deployConfig } from './config.js';
import path from 'path';
  • NodeSSH: 这是 node-ssh 库的核心模块,提供了与远程服务器通过 SSH 协议进行通信的功能。

  • deployConfig: 从外部的 config.js 文件导入配置信息,通常这个配置会包含 SSH 连接所需的信息(如服务器地址、用户名、私钥路径等)。

    javascript 复制代码
       export const deployConfig = {
           host: '服务器地址',
           username: '服务器名称',
           password: '服务器密码'
         }
  • path: Node.js 内建的模块,用于处理文件路径和目录。

2. 获取当前目录路径

javascript 复制代码
const __dirname = path.dirname(new URL(import.meta.url).pathname);
  • 由于你的代码使用了 ESM 模块(通过 importexport),__dirname 在这种模式下并不存在。为了获取当前文件所在的目录路径,使用了 path.dirname()import.meta.url 来实现获取路径。

3. 部署函数 deploy

javascript 复制代码
async function deploy() {
  const ssh = new NodeSSH();
  • 创建了一个 NodeSSH 实例 ssh,它将用于与远程服务器进行连接、执行命令以及文件上传等操作。

4. 连接到远程服务器

javascript 复制代码
await ssh.connect(deployConfig);
console.log('SSH 连接成功!');
  • ssh.connect(deployConfig):这个方法会使用 deployConfig 中的配置来连接到远程服务器。deployConfig 包含了你连接 SSH 所需要的所有信息,如 host, username, privateKey 等。
  • 如果连接成功,打印出 "SSH 连接成功!"

5. 执行命令

javascript 复制代码
const result = await ssh.execCommand('ls');
console.log('命令执行结果:', result);
  • execCommand('ls'):在远程服务器上执行 ls 命令,通常用来列出远程目录的文件。这个方法会返回一个包含命令执行结果的对象,包含 stdoutstderr 字段(分别表示标准输出和错误输出)。
  • 将命令的执行结果打印到控制台。

6. 执行部署脚本

javascript 复制代码
const deployScript = `
  cd nginx下载地址;
`;
const deployResult = await ssh.execCommand(deployScript);
console.log('部署脚本执行结果:', deployResult);
  • 你定义了一个部署脚本,脚本的内容是进入 nginx的 目录。虽然这个脚本很简单,但通常部署脚本会包含更多的操作,比如下载代码、配置文件修改等。
  • 然后通过 execCommand 执行这个脚本,并打印执行结果。

7. 准备上传本地文件夹

javascript 复制代码
let localDistPath = path.join(path.dirname(__dirname), 'dist');
localDistPath = localDistPath.replace(/^\\+/, '');
  • 这里使用了 path.join() 结合 __dirname 来确定本地 dist 文件夹的路径。path.dirname(__dirname) 取的是当前文件的父级目录,再通过 path.join() 加上 'dist',确定了本地的 dist 文件夹路径。
  • 然后使用 replace(/^\\+/, '') 来去除路径开头的多余反斜杠(\\+ 表示匹配一个或多个反斜杠)。

8. 定义远程路径

javascript 复制代码
const remoteDistPath = '服务器默认打开文件夹地址';
  • 这是远程服务器的目标目录,你希望将本地的 dist 文件夹上传到该目录。

9. 上传文件夹到远程服务器

javascript 复制代码
const uploadResult = await ssh.putDirectory(localDistPath, remoteDistPath, {
  recursive: true,
  concurrency: 10,
});
  • putDirectory(localDistPath, remoteDistPath, options):这是 node-ssh 提供的一个方法,用于将本地的整个目录上传到远程服务器。
    • localDistPath: 本地的 dist 文件夹路径。
    • remoteDistPath: 远程服务器上的目标路径。
    • options: 配置项,recursive: true 表示递归上传子目录,concurrency: 10 表示最多同时上传 10 个文件,优化上传速度。
  • 上传操作的结果存储在 uploadResult 中,这个对象包含上传过程中的信息。

10. 打印上传结果

javascript 复制代码
console.log('上传结果:', uploadResult);
  • 将上传的结果打印到控制台。uploadResult 将包含上传文件的状态信息。

11. 错误处理

javascript 复制代码
} catch (err) {
  console.error('SSH 连接或命令执行出错:', err);
}
  • 如果连接或命令执行中发生错误,catch 语句会捕获到错误,并打印出来。

12. 调用 deploy 函数

javascript 复制代码
deploy();
  • 最后,调用 deploy 函数来启动部署过程。

至此,自动化部署的配置文件已经完成,接下来就是使用

  • 在package里配置运行指令:不需要单独打包和运行部署,使用&&直接一键打包并部署
javascript 复制代码
    "deploy": "rimraf dist && NODE_OPTIONS=--max-old-space-size=8192 vite build && node scripts/node_ssh.js",
  • 🆗,直接快乐玩耍,pnpm run deploy 直接一键打包且部署到指定服务器

总结

  1. SSH 连接 :通过 ssh.connect() 连接到远程服务器,成功连接后可以执行命令或上传文件。
  2. 命令执行 :使用 execCommand() 执行远程命令,并获得结果。
  3. 上传文件夹 :通过 putDirectory() 方法将本地目录上传到远程服务器。
  4. 错误处理 :通过 try-catch 捕获可能发生的错误并输出日志。

这个流程适用于自动化部署的场景,可以将本地的构建产物上传到远程服务器,并执行必要的命令来完成部署。


至此,实现基础的自动化部署功能

相关推荐
徐小夕17 分钟前
JitWord Office预览引擎:如何用Vue3+Node.js打造丝滑的PDF/Excel/PPT嵌入方案
前端·vue.js·github
晴殇i26 分钟前
揭秘JavaScript中那些“不冒泡”的DOM事件
前端·javascript·面试
孟陬1 小时前
国外技术周刊 #1:Paul Graham 重新分享最受欢迎的文章《创作者的品味》、本周被划线最多 YouTube《如何在 19 分钟内学会 AI》、为何我不
java·前端·后端
BER_c1 小时前
前端权限校验最佳实践:一个健壮的柯里化工具函数
前端·javascript
兆子龙1 小时前
别再用 useState / data 管 Tabs 的 activeKey 了:和 URL 绑定才香
前端·架构
sudo_jin1 小时前
前端包管理器演进史:为什么 npm 之后,Yarn 和 pnpm 成了新宠?
前端·npm
敲敲敲敲暴你脑袋1 小时前
写个添加注释的vscode插件
javascript·typescript·visual studio code
叁两2 小时前
用opencode打造全自动公众号写作流水线,AI 代笔太香了!
前端·人工智能·agent
golang学习记2 小时前
GitLens 十大神技:彻底改变你在 VS Code 中的 Git 工作流
前端·后端·visual studio code
SuperEugene2 小时前
后台权限与菜单渲染:基于路由和后端返回的几种实现方式
前端·javascript·vue.js