【自动化】利用webhooks自动化构建、编译Vue

时间:2022-07-22
本文章向大家介绍【自动化】利用webhooks自动化构建、编译Vue,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

1. 前言

前言,懒,使人进步,程序员也不例外!

当你每次进行如下操作:

修改代码、npm run build、upload dist to server

是不是很烦?

很简单,利用github/gitee的web hooks + 宝塔web hooks即可完成自动化构建

2. 前提

服务器端安装Node、npm、vue

然后,找到gitee的设置:

这样,当每次进行push操作时,gitee就会自动回调一个地址

这个地址怎么来?

如果你使用的是宝塔面板,那么简单多了,就安装web hooks插件,编写回调后的脚步代码(要执行的操作就行)

添加脚本代码即可:

贴一下我的代码:

PATH=/usr/bin:/usr/local/node-v10.9.0-linux-x64/bin

export PATH

cd xxxx/repo && git pull  &&  npm run build && cp -r ./dist/* ../

值得一说的是,要导出环境变量,也就是你git/npm命令所在的目录,不然是执行不了的....


添加之后,点击查看密钥:

复制地址到gitee即可:

3. 不使用宝塔

当然也没问题,你只需要使用python、nodejs或其他语言,监听一个端口,然后gitee的回调地址填上你监听的地址即可

所以,宝塔已经提供了,为啥我还要自己弄?