使用gitlab的cicd自动化部署vue项目shell流程踩坑之路

news2024/12/23 22:07:48

强烈建议:先在部署的服务器上手动跑一边流程

包括:(服务器上要安装node、npm、git等依赖)

1. git clone 仓库地址

2. npm install / yarn  安装依赖

3. cp -rf dist/ /var/www/html

如果以上步骤都没有出错,那再安装gitlab-runner进行自动化构建

提示:

安装git:

apt install git

安装node:

curl -sL https://deb.nodesource.com/setup_14.x | sudo -E bash -

稍等片刻,源已经添加完毕,再执行:

sudo apt-get install -y nodejs

然后再执行:

安装nvm切换node版本和切换npm源的方式:

nrm安装:设置npm源的几种方式_招财酷炫猫的博客-CSDN博客_npm 源

nvm安装:Ubuntu系统安装:node及node版本管理工具nvm_1024小神的博客-CSDN博客

如果以上手动部署后没问题,开始自动化部署流程

1.安装gitlab-runner

2.注册gitlab-runner

3.编写.gitlab-ci.yml文件

1.安装gitlab-runner (执行构建任务):

gitlab-runner可以理解为一个进程,可以跑在任何服务器上,一般都安装在项目要部署的服务器上,或者自己电脑本地也可以:

push 代码到gitlab上时,gitlab将变动通知给gitlab-CI,gitlab-CI会找到该工程下的gitlab-runner 并通知该runner执行相应脚本 

Linux安装docker :Install GitLab Runner manually on GNU/Linux | GitLab

用官方的安装方式:

先看一下自己服务器类型:uname -a

可以看到是x86系统,所以:

curl -LJO "https://gitlab-runner-downloads.s3.amazonaws.com/latest/deb/gitlab-runner_amd64.deb"

开始安装:

 对于 Debian 或 Ubuntu:

dpkg -i gitlab-runner_amd64.deb

 安装完之后可以查看一下状态:gitlab-runner status 

开始注册到gitlab仓库里面:

 先到gitlab仓库查看一下runner下面的信息:

 这两个是比较重要的,注册的时候要用:

 注册:

gitlab-runner register

//注册时要输入的内容
url(gitlab服务器地址,就是上图画红线的地方)
token(项目token,就是上图画红线的地方) gitlab中按项目>Setting>CI/CD>Runners
executor(执行器,有shell,docker)等 本文选的是shell
tags(用来匹配jobs和执行任务设备(runner) 和yml脚本里的tags保持一致)

 2.编写.gitlab-ci.yml文件:

.gitlab-ci.yml

git项目的根目录里的文件,记录一系列规则和执行规则
可以在gitlab上使用CI Lint验证上面yml文件的正确行。CI Lint在 CI/CD里面。

####提示
# 1.以下脚本设置的是master分支被合并时执行(设置为平常用来发版本的分支即可)
# 2.版本自动化部署到nginx下
# 3.执行yml脚本的runner名字设置的vue-runner1,即对应tags

stages: # Stages 表示构建阶段,这里有两个阶段 install, deploy
    - install
    - deploy

cache:
    key: ${CI_BUILD_REF_NAME}
    paths:
        - node_modules/

install-staging:dep: # Jobs 表示构建工作,表示某个 Stage 里面执行的工作。
    stage: install
    tags:
        - cvtags #runner执行器的名字,与注册runner时填写的tags保持一致
    only: # 定义了只有在被merge到了master分支上 才会执行部署脚本。
        - master
    script:
        - echo "=====cat node/npm======"
        - sudo npm install -g nrm # 主要用来切换npm源
        - sudo nrm use taobao
        - npm -v
        - node -v
        - npm config get registry
        - whereis npm # 主要用来定位问题
        - whereis node
        - echo "=====start install======"
        - sudo npm install #安装依赖
        - echo "=====end install======"
    artifacts: # 将这个job生成的依赖传递给下一个job。需要设置dependencies
        expire_in: 60 mins # artifacets 的过期时间,因为这些数据都是直接保存在 Gitlab 机器上的,过于久远的资源就可以删除掉了
        paths: # 需要被传递给下一个job的目录。
            - node_modules/

deploy-staging:dep:
    stage: deploy
    tags:
        - cvtags
    only:
        - master
    script:
        - echo "=====start build======"
        - sudo npm run build # 将项目打包
        - echo "=====end build======"
        - echo "=====start deploy======"
        - sudo cp -rf ./dist/*  /var/www/html/
        - echo "=====end deploy!!!!!!======"

编写完成之后,开始推送到远程仓库,然后打开CI/CD理论上就可以看到runner在跑了:

打红×的表示出错了,,,,,,因为在调试的过程中,很多问题!!!真的很多坑

虽然刚开始已经手动部署可以成功了,但是自动化部署还是需要注意:

1.给gitlab-runner添加权限

2.执行脚本命令要添加sudo

3.服务器的node环境和gitlab-runner里面的版本不一样??这就很奇葩了

遇到的问题

安装在哪里

  • 一般安装在与gitlab所在不同的服务器上,可以注册在部署开发环境项目的服务器上

token可以多个项目共享吗?

  • 可以为项目特定的token 也可以设置多个项目共享一个token

gitlab-runner遇到的问题

1.job执行失败

在.gitlab-ci.yml的 tags字段里也必须明确指明这些 tags。

2.gitlab runner 权限不够

vim /etc/sudoers 
gitlab-runner ALL=(root) NOPASSWD: ALL  
#加上NOPASSWD: ALL,执行命令时不用再输入passwd for gitlab-runner

3.执行yml脚本里命令提示yarn 安装失败node-sass

根目录下创建.yarnrc

registry "https://registry.npm.taobao.org"
sass_binary_site "https://npm.taobao.org/mirrors/node-sass/"

4.gitlab12.7之后自动开启auto devops

导致每次push项目都会执行job。可在管理员角色下取消 Default to Auto DevOps pipeline for all projects 的选中状态,然后点击 Save changes 即可

5.runner注册失败

ERROR: Registering runner... failed 

runner=zoiK2SqN status=401 Unauthorized PANIC: Failed to register this runner. Perhaps you are having network problems 原因是:gitlab版本和gitlab-runner不兼容,已知的gitlab版本低于9.x的gitlab runner只能用v1.11.1

6.failed to remove XXX,failed to remove dist/index.html,warning: failed to remove xxxx: Permission denied;

简单粗暴地编辑/etc/passwd,将gitlab-runner账号对应的uid:gid改为0:0(和root一样)。

 

7.终极调试技巧:

如果不知道问题发生在哪里,就把手动部署的命令放到脚本里面执行,然后看输出的内容和手动部署的有什么差别,然后对应的调整脚本内容:

这些脚本执行的结果会在job的日志里面看到:然后针对性的调整

最后的最后:功夫不负有心人,终于让我跑成功了一次!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/65802.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

自从面试了一个测试岗00后卷王,老油条感叹真干不过,但是...

周末和技术大佬们聚餐,聊到了测试行业的“金九银十”高峰就业问题,普遍认为转行和大学生入行的越来越多,内卷之势已然形成。 现在不论面试哪个级别的测试工程师,面试官都会问一句 “会编程吗?有没有自动化测试的经验&…

当线下门店遇上AI:华为云ModelBox携手佳华科技客流分析实践

摘要:在赋能传统门店客流经营数字化转型方面,华为云ModelBox与伙伴佳华科技合作推出的“华为云客流统计项目”,算是一次成功的探索。本文分享自华为云社区《当线下门店遇上AI—华为云ModelBox携手佳华科技客流分析实践》,作者&…

linux安装mysql8超详细到每步命令

1、到指定目录去下载安装包 cd /usr/local/src 2、下载mysql8 版本可以自己选择 wget https://dev.mysql.com/get/Downloads/MySQL-8.0/mysql-8.0.20-linux-glibc2.12-x86_64.tar.xz 3、解压mysql8, 通过xz命令解压出tar包(需要发时间解压可能会久,根据服务器性…

如何理解死锁?

目录 今日良言:等风来,不如追风去 一、死锁 1.概念 2.死锁的三个典型情况 3.死锁的必要条件 4.如何破除死锁 🐳今日良言:等风来,不如追风去 🐕一、死锁 🐇1.概念 多个线程在争夺资源时,陷入了僵持状态,都无法进行下去,都在等待对方释…

一种非线性权重的自适应鲸鱼优化算法IMWOA附matlab代码

✅作者简介:热爱科研的Matlab仿真开发者,修心和技术同步精进,matlab项目合作可私信。 🍎个人主页:Matlab科研工作室 🍊个人信条:格物致知。 更多Matlab仿真内容点击👇 智能优化算法 …

uni-app简介、条件编译、App端Nvue开发、HTML5+、开发环境搭建、自定义组件、配置平台环境、uniCloud云开发平台

uni-app简介 : 概述:uni-app是一个前端跨平台框架:会uni-app就可以用一套代码(类似vue语法)打包出安卓、ios、及各种小程序(微信、qq、支付宝等)端跨平台发布。 生态:完整的生态&a…

Spring6 正式发布!重磅更新,是否可以拯救 Java

简介 Spring Framework6 和 Spring Boot3 是一个跨越式的升级整个框架支持的最低 JDK 版本直接跨越到 JDK17,无论框架层还是基础设施层都做了巨大的改变,Spring 6.0 新框架具体做了哪些功能的升级与改进,是否有必要升级与使用呢?…

html网页制作期末大作业成品:基于HTML+CSS+JavaScript简洁汽车网站(7页)

🎉精彩专栏推荐 💭文末获取联系 ✍️ 作者简介: 一个热爱把逻辑思维转变为代码的技术博主 💂 作者主页: 【主页——🚀获取更多优质源码】 🎓 web前端期末大作业: 【📚毕设项目精品实战案例 (10…

「Redis」07 持久化操作(RDB、AOF)

笔记整理自【尚硅谷】Redis 6 入门到精通 超详细 教程 Redis——持久化操作(RDB、AOF) 1. RDB(Redis DataBase) 概述 RDB是什么 在指定的时间间隔内将内存中的数据集快照写入磁盘, 即 Snapshot 快照,恢…

实战 Creator 2.x 项目升级 3.x!避坑要点与基础 API 写法差异总结

最近,我将自己在 Cocos Store 上的一个 2D 项目《球球要回家》从 Creator 2.2.2 升级到 Creator 3.6.2,编程语言也从 JavaScript 全面升级至 TypeScript 并适配微信小游戏,目前在微信审核中!本篇文章就来跟大家分享一下&#xff0…

发布3天获推荐10w+,视频号内容出现新玩法?

上月,腾讯发布Q3季度财报,视频号也被重点提及,广告主对其早前上线的原生信息流广告需求强劲,像首批投放的阿玛尼等品牌的广告还曾引起过不少讨论。用户对视频号广告的关注热度高,也从侧面说明,视频号目前的…

大数据流批一体

流批一体的内涵 流批一体中的“流批”是指流处理与批处理,是两种不同的数据处理方式,而不是对数据种类的划分。具体来说,数据可以按产生的时间划分为历史数据与实时数据,亦可按数据的明细程度分为流水数据与切片数据;数…

VS2022环境下C++ DLL动态链接库的编写和调用

一、编写DLL动态链接库 1、新建动态链接库项目 2、新建类 3、宏定义 #ifdef DLL_API # define DLL_API _declspec(dllexport) # else # define DLL_API _declspec(dllimport) #endif 4、使用宏定义修饰类 /*h*/ #pragma once#ifdef DLL_API # define DLL_API _declspec(dl…

ad2019--LED灯按键类创建元件库

摘自凡亿教育 一、LED灯按键类创建元件库 1.绘制LED灯的原理图库 鼠标右击箭头所指的,然后选择倒数第三个,多边形 在画的时候可以按住,shift空格,来调整角度。 但是,一般的LED灯都是蓝色的,我们可以把它…

用MybatisPlus代码生成器生成代码

作者简介 作者名:编程界明世隐 简介:CSDN博客专家,从事软件开发多年,精通Java、JavaScript,博主也是从零开始一步步把学习成长、深知学习和积累的重要性,喜欢跟广大ADC一起打野升级,欢迎您关注&…

用帝国主义竞争算法(ICA)求解旅行商问题(TSP)(Matlab代码实现)

🍒🍒🍒欢迎关注🌈🌈🌈 📝个人主页:我爱Matlab 👍点赞➕评论➕收藏 养成习惯(一键三连)🌻🌻🌻 🍌希…

两大产品上线“粤复用”,赋能大数据智能行业发展

为深入贯彻落实国家《关于加强数字政府建设的指导意见》关于数字政府应用“一地创新、各地复用”的部署要求,促进优秀应用成果快速、可靠、低成本地复用推广,正式上线广东数字政府应用超市——“粤复用”。据悉,“粤复用”应用超市汇聚各级政…

spring-aop源码分析(2)_AnnotationAwareAspectJAutoProxyCreator后置处理器

本文将通过阅读AnnotationAwareAspectJAutoProxyCreator后置处理器的源码,分析其解析AOP通知、匹配切入点和创建AOP代理的流程。 入口 AnnotationAwareAspectJAutoProxyCreator是一个BeanPostProcessor实现,他在容器进行initializeBean的时候被调用&am…

[附源码]计算机毕业设计汽车美容店管理系统Springboot程序

项目运行 环境配置: Jdk1.8 Tomcat7.0 Mysql HBuilderX(Webstorm也行) Eclispe(IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持)。 项目技术: SSM mybatis Maven Vue 等等组成,B/S模式 M…

TDH社区版上新宽表数据库Hyperbase,轻松实现海量数据的毫秒级精确检索

日前,为了降低用户接触使用大数据技术的门槛以及成本,星环科技推出TDH社区版(Transwarp Data Hub Community Edition)来帮助企业用户、高校师生、科研机构以及其他专业开发人更简单、更便捷的进行大数据分析。为了满足更多用户在存…