TS+Node 构建前端一键部署工具

工具地址

「cbd-deploy-cli」:

功能概览

具体的用法指导 「README.md」 有详细的描述,这里简单地介绍一下:

安装

  • 全局安装
npm install cbd-deploy-cli -g
复制代码
  • 本地安装
npm install cbd-deploy-cli --save-dev
复制代码

初始化

cbd-deploy-cli init
复制代码

「init」 之后会根据用户输入的配置在当前目录下生成 「develop.config.js」 文件,这里要注意以下几点:

  • 部署的环境包括 「dev」(测试环境) 和 「prod」(生产环境), 是多选

  • 项目类型包括 「Web」「Hybrid App」, 这是单选。「Web」 就相当于普通的应用就好,这应该是最普遍的场景。两者生成的文件有略些差异,「Hybrid」 这里会包括「小程序」/「web」 以及 「Native App」三个平台,而且是在输入部署命令后「相继部署」,不需要再另外操作

  • Web App

  • Hybrid App

ps: 这里如果有朋友想使用这个工具,「Web App」 类型就足够了,「Hybrid」主要是针对我本人现在工作的痛点添加的功能,如果有人跟我一样的遭遇那真的是太幸运了。

配置文件

输入 「init」 命令后生成了配置文件,这里还是推荐自己手动编辑,因为如果是「Hybrid」项目类型会有很多输入。

  • Web App
// deploy.config.js
module.exports = {
  "projectName": "cbd-deploy-cli",
  // 开发环境
  "dev": {
    "name": "开发环境",  // 环境名称
    "script": "npm run build", // 打包命令
    "host": "localhost", // 服务器地址
    "port": 22, // 服务器端口号
    "username": "root", // 服务器登录用户名
    "password": "", // 服务器登录密码
    "privatekey": "xxxx/.ssh/id_rsa", // 服务器对应本地私钥
    // password | privatekey 选填一个就可以
    "distpath": "dist", // 本地打包生成目录
    "webdir": "/",  // 服务器部署路径(不可为空或'/')
    "isremoveremote": false // 是否删除远程文件(这里是目录删除,请谨慎开启,上传解压后会自动覆盖)
  },
  // 生产环境
  "prod": {
    "name": "生产环境",
    "script": "npm run build",
    "host": "localhost",
    "port": 22,
    "username": "root",
    "password": "",
    "privatekey": "xxxx/.ssh/id_rsa",
    "distpath": "dist",
    "webdir": "/",
    "isremoveremote": false
  }
}
复制代码
  • Hybrid App
module.exports = {
  "projectName": "cbd-deploy-cli",
  // 开发环境
  "dev": {
    "name": "开发环境", // 这里注意一下区别
    // 小程序
    "mini": {
      "script": "npm run build",
      "host": "localhost",
      "port": 22,
      "username": "root",
      "password": "",
      "privatekey": "xxx/.ssh/id_rsa",
      "distpath": "dist",
      "webdir": "",
      "isremoveremote": false
    },
    // web
    "web": {
      "script": "npm run build",
      "host": "localhost",
      "port": 22,
      "username": "root",
      "password": "",
      "privatekey": "xxx/.ssh/id_rsa",
      "distpath": "dist",
      "webdir": "",
      "isremoveremote": false
    },
    // 原生
    "native": {
      "script": "npm run build",
      "host": "localhost",
      "port": 22,
      "username": "root",
      "password": "",
      "privatekey": "xxx/.ssh/id_rsa",
      "distpath": "dist",
      "webdir": "",
      "isremoveremote": false
    }
  }
}
复制代码

部署

注意:命令后面需要加 --mode 环境对象 (如:--mode=dev 或者 --mode dev

cbd-deploy-cli deploy --mode=dev    
复制代码

程序会自动进行如下操作:

这时候,项目已经成功发送到服务器中,全程不超过10秒,是不是省下了好多时间。而在 「Hybrid」下更是明显,三个平台「程序相继发布」,一个命令敲完之后无需再做任何操作,三个平台即可部署完毕。

实现逻辑

这里简单说下自己的实现逻辑,因为「Web」下的逻辑主要借鉴别人的,自己只是用「typescript」重新写了一下后做了一些修改而已。但「Hybrid」是我在这些基础上另外加的功能,做到了两者的兼容。

这里不贴什么代码,具体的实现可以直接在「GitHub」里看到,用流程图简单写下整个功能的逻辑:


作者:夏天Summer
链接:https://juejin.cn/post/6876330440043692046
来源:掘金
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。
原文地址:https://www.cnblogs.com/love314159/p/14133499.html