gitlab前端自动化部署记录(4)-gitlab-ci.yml配置文件编写

上篇:https://blog.csdn.net/zzwjr123/article/details/112968789

接下来就是在vue项目根目录编写.gitlab-ci.yml脚本,然后就发现之前的理解错了,gitlab-runner触发的任务执行npm的时候并不是在gitlab-runner的镜像中安装nodejs,这样安装执行脚本的时候会报npm:not found,所以暂时的解决方案是在脚本中安装node镜像后,再执行npm

这部分每个项目都不一样,之前没接触过这部分的内容,我以我做的时候的例子为例并记录下我遇到的问题,最后是自动发布的功能是实现了,但是这文件应该还是存在很多问题后续可以改进。

直接上代码:

stages:
 - build
 - deploy
cache:
  key: ${CI_BUILD_REF_NAME}
  paths:
    - node_modules/
install:
  stage: build
  image: node:14-buster  #拉取node镜像
  only:
    - master
  script:
    - npm install cnpm -g --registry=https://registry.npm.taobao.org  #设置cnpm
    - cnpm install node-gyp #这个不一定需要
    - cnpm install  #安装依赖
    - npm run build  #编译
  artifacts:  #这个是为了能在下个作业中获取到这个dist
    paths:
    - dist/
  tags: 
    - xxxx  #需要和创建runner的tags一样才会执行
movedist:
  stage: deploy
  image: docker  #拉取docker容器
  only:
    - master
  script:
    - docker exec [container] sh -c \ 'rm -rf /data/*' #把旧的文件夹及文件都删除
    - docker cp dist/ [container]:/data/    #把生成的文件拷贝到项目容器的指定目录下(我这里是/data)
    - docker exec [container] sh -c \ 'mv /data/dist/* /data' #把dist内容移到data下
    - docker restart [container]  #重启容器
  dependencies:
  - install
  tags: 
    - xxxx  #需要和创建runner的tags一样才会执行

stages定义了两个任务,build和deploy

1、build用来编译vue工程,一开始尝试在容器中安装node环境,在执行npm的时候提示npm:not found,所以通过脚本来安装node,然后就可以cnpm了,安装依赖这遇到了一个问题困扰了很久,就是node-sass这个包怎么也安装不成功,只能安装5.0.0版本的,但是这个版本和sass-loader不兼容,换成5.0以下的,就会报以下错误:

Downloading binary from https://cdn.npm.taobao.org/di...
Cannot download "https://cdn.npm.taobao.org/dist/node-sass/v4.13.0/linux_musl-x64-88_binding.node":
HTTP error 404 Not Found
...
gyp verb check python checking for Python executable "python2" in the PATH
gyp verb which failed python Error: not found: python
gyp ERR! configure error
gyp ERR! stack Error: Can't find Python executable "python", you can set the PYTHON env variable
...

更换源之后,然后会报没有python的错误,这里一个方法是安装python编译,这个方法没试过,我换了一种方式,将本地的node-sass提交到git上,脚本安装的时候不去安装node-sass依赖,windows上编译的不兼容,一定要在linux编译,然后提交到git上,之后build成功。

2、deploy部署,首先就是需要docker环境,因为前端项目在另一个容器中,通过docker cp把dist移动到容器中,重启,完成部署。

过程踩了很多坑,也是一边摸索一边开发的,所以对整个gitlab-ci的理解并不深,但是经过多次尝试也能达到效果,后续可以继续熟悉并优化。

。。。。
。。。。
。。。。

安装node(不需要,一开始以为需要在runner容器中安装node环境,装完之后发现,在执行ci脚本的时候没法找到runner容器的环境,所以没啥用,下面可以不看。。。)

因为是部署vue的项目,所以需要nodejs环境,具体安装过程不赘述,可以参考:

https://www.cnblogs.com/zhi-leaf/p/10979629.html

这里因为是在docker里安装的原因,很多工具需要重新下载,按上面链接提供的先下载完最新版的nodejs的安装包,我解压时发生报错,错误如下:

tar (child): xz: Cannot exec: No such file or directory
tar (child): Error is not recoverable: exiting now
tar: Child returned status 2
tar: Error is not recoverable: exiting now

这里先安装xz的相关包,apt install xz-utils,安装后即可解压,失败的话可先执行apt-get update,按链接方法安装nodejs成功。

顺便安装下cnpm

npm install -g cnpm --registry=https://registry.npm.taobao.org

设置软链接

ln -s /usr/local/nodejs/bin/cnpm /usr/local/bin/cnpm

cnpm -v 显示相关信息即可


版权声明:本文为zzwjr123原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。