从零开始摸索VUE,配合Golang搭建导航网站(四.项目运行环境搭建和CI脚本编写)

545 阅读3分钟

「这是我参与11月更文挑战的第4天,活动详情查看:2021最后一次更文挑战

部署简介

自己使用的是GitLab的CICD(Continuous integration,Continuous deployment)的自动部署运维方案,GitLab安装在我自己的树莓派上,配套的GitLab Runner也在那树莓派上,树莓派需要提前安装npm,并已经部署好了。把代码提交到Gitlab上特殊分支的时候触发GitLab的CICD进行自动化部署项目。

安装Node.js

安装Node.js目的是在自动部署的时候使用shell命令执行npm install下载项目的第三方依赖。 首先要注意自己的树莓派的系统,一开始我以为自己的树莓派是armv7架构,下载了安装包运行不了,使用uname -a查看自己的系统架构:

image.png

是aarch64架构,AArch64是ARMv8 架构的一种执行状态,使用全新的 A64 指令集,网上的很多教程都是ARMv7的系统,是32位的ARM构架。
访问官网:nodejs.org/en/download…
现在已经出了node v16,我们选择一个还在维护的老版本吧:
image.png

wget wget https://nodejs.org/download/release/v12.20.1/node-v12.20.1-linux-arm64.tar.xz
xz -d node-v12.20.1-linux-arm64.tar.xz
tar -xavf node-v12.20.1-linux-arm64.tar

解压完成把解压完成的文件加复制到/usr/local/node下面

sudo mv ./node-v12.20.1-linux-arm64 /usr/local/node

建立软连接

sudo ln -s /usr/local/node/bin/node /usr/bin/node
sudo ln -s /usr/local/node/bin/npm /usr/bin/npm

到此就完成了 检查一下node和npm的版本,使用node -vnpm -v命令查看:

image.png

同样设置镜像源:

npm config set registry https://registry.npm.taobao.org

编写.gitlab-ci.yml

没有介绍GitLab及其runner的安装,有兴趣可以查看我的历史文章,介绍了怎么安装这两个软件,以及怎么使用内网穿透,在公网使用。 gitlab-ci.yml作用就是在提交代码的时候触发一系列的自动化项目部署操作,直接上代码,注释里面再解释:


stages:
  - build  #任务阶段。只写了一个一个build阶段

build_develop:
  stage: build  #指定这个build_develop任务在build阶段
  script:
    - npm install --unsafe-perm  # 执行npm install 安装第三方依赖,--unsafe-perm为了解决一些安装的时候出现了一些无权限创建文件的报错
    - rm -rf ./dist/   # 删除之前打包生成的代码文件
    - npm run build   #重新打包生成文件
    - rm -rf /opt/vue-web/ #删除之前上次打包的的文件夹
    - cp -rf ./dist/ /opt/vue-web/ #把build生成的文件打包到nginx指定的文件夹
    - docker restart web  #重启Docker的Nginx容器,这时候前端的所有的静态文件都是新的了
  only:
    - master # 指定只在master分支执行这个任务。
  tags: 
    - b4master  #指定执行任务的runner,安装runner的时候会提示填写runner的标签(tag)

把这个文件写好放在项目根目录通过Git同步到Gitlab,然后经过分支合并触发CI任务。现在的项目就新建了两个分支一个develop和master,develop用于暂存代码到线上,可以随时把代码拉取下来,master分支用于直接上线。一般正规的项目的项目至少还需要一个预发布(pre-release)分支,在预发布分支和master分支的的数据一样,逻辑代码不一样,所以需要预发布分支用于真实模拟线上测试,因为前端在下载依赖的时候通常比较繁琐,在这种多任务频繁合并的环境中通常还需要加上任务缓存(cache),在多个分支合并连续打包的时候不用每次都从零开始下载第三方包,加快上线速度,我们后面有机会可以试一下。

总结

这篇讲了一下在树莓派上安装node和编写CI脚本,对于CI不清楚的可以看看我之前的文章,下篇介绍如何使用Docker进项目录映射端口映射来达到真实可以访问的目的。