服务器一台,建议2核4G以上。
1.安装node
2.安装git
3.安装nginx
4.下载并安装gitlab
5.下载并注册runner
如图在仓库这里能查找到对应的url和token,注意填写runner的描述时要跟后文的.gitlab-ci.yml里对应起来
6.在仓库下建立.gitlab-ci.yml文件 .gitlab-ci.yml:
# 阶段
stages:
- build
- deploy
# 缓存 node_modules 减少打包时间,默认会清除 node_modules 和 dist
cache:
paths:
- node_modules/
# 拉取项目,打包
build:
stage: build # 阶段名称 对应,stages
tags: # runner 标签(注册runner时设置的,可在 admin->runner中查看)
- webpack-vue-cicd
script: # 脚本(执行的命令行)
- whoami
- cd ${CI_PROJECT_DIR} # 拉取项目的根目录
- npm install # 安装依赖
- npm run build # 运行构建命令
only:
- main #依赖的分支
artifacts: # 把 dist 的内容传递给下一个阶
paths:
- dist/
# 部署
deploy:
stage: deploy # 阶段名称 对应,stages
tags: # runner 标签(注册runner时设置的)
- webpack-vue-cicd
script: # 脚本(执行的命令行)
- rm -rf /home/wwwroot/html/*
- cp -rf ${CI_PROJECT_DIR}/dist/* /home/wwwroot/html/ # 把包完成,复制 dist 下的文件到对应的项目位置
后面每次推送main分支时就会走对应的build和deploy,生成对应的dist和复制到对应的nginx目录。 以上就是大概整体流程,其中的坑挺多的,特别是第3步以后~慢慢踩
发散:这里可以用到uniapp小程序,打包dist给测试同学快速体验。
参考: