动机

我的项目不直观，无奈明确感知是哪个我的项目。

yaml配置

# .gitlab-ci.ymlimage: node:latest # 针对前端，抉择适合的node镜像# 定义各阶段的执行程序stages:  - build  - deploy# 在脚本执行前设置npm源before_script:  - npm config set registry https://registry.npm.taobao.org/  - npm config set cache-folder .cache/# 定义各阶段的具体执行命令# artifacts缓存在gitlab上的工件，用于将指定目录下的文件下载下来build:  stage: build  script:    - npm i    - npm run build  artifacts:    paths:      - distpages: # 该工作命名必须是pages，是gitlab外部工作  stage: deploy  approval: false  script:    - rm -rf public/*    - mv dist/* public  artifacts:    paths:      - public  only:   - bundler-rollupcache:   # 定义缓存文件  paths: # 定义缓存文件的门路    - node_modules # 在下一次触发 gitlab-ci 时，缓存会被还原，就不必反复装置依赖。    - dist # 同时把 build 阶段生成的 dist 文件夹也缓存起来，在 deploy 阶段会用到。

Pages流程介绍

在push源代码到仓库的时候，Gitlab能够依据我的项目中的 .gitlab-ci.yml 文件来主动构建我的项目，而后部署到服务器中。

外围点

• 打包动态资源
• 配置指定工作pages，将动态资源迁徙到public目录下

Notes：

**stage: deploy**默认是须要审批的，能够通过：

• stage命名刻意回避deploy
• 通过approval: false回避审批

审批不能是本人，即便本人是代码拥有者，也无奈本人审批本人（审批按钮无奈应用）。

后果预览

参考文档

• 配置Gitlab pages和Gitlab CI
• 利用gitlab-ci和gitlab-pages收费主动构建部署vue我的项目