jenkins上部署前端vue项目

简介: jenkins上部署前端vue项目

在这里默认读者已经安装完jenkins,如有没有安装的可参照

jenkins安装与部署

具体步骤

配置步骤按照以下图片操作即可

构建项目

image.png

General

image.png

源码管理

image.png

构建环境

image.png

注:此处的nodejs14是需要在系统管理-》全局工具配置 中配置以下nodejs

在这之前,需要先安装nodejs插件
image.png

构建

image.png
shell脚本如下:

cd /root/.jenkins/workspace/qiaomu-vue
node -v
npm -v
npm install
npm run build
cd dist
rm -rf qiaomu-vue.tar.gz
tar -zcvf qiaomu-vue.tar.gz *

构建后操作

image.png
注:deploy.sh(存放到目标服务器的/tools/soft/html文件夹内) 脚本的内容


#!/bin/bash
tar -xzvf $1 -C $2
find $2 -name "*.tar.gz" -exec rm -rf {
   
   }  \;
echo '发布成功'
目录
相关文章
|
10天前
|
JavaScript 前端开发 Java
SpringBoot + Vue 前端后分离项目精进版本
这篇文章详细介绍了一个基于SpringBoot + Vue的前后端分离项目的搭建过程,包括前端Vue项目的初始化、依赖安装、页面创建和路由配置,以及后端SpringBoot项目的依赖添加、配置文件修改、代码实现和跨域问题的解决,最后展示了项目运行效果。
SpringBoot + Vue 前端后分离项目精进版本
|
6天前
|
前端开发 应用服务中间件 nginx
前端服务器部署方式
【8月更文挑战第25天】前端服务器部署方式
19 1
|
16天前
|
负载均衡 前端开发 应用服务中间件
使用Nginx配置SSL以及部署前端项目
本文介绍了如何使用Nginx配置SSL证书以启用HTTPS,并展示了如何通过Nginx部署前端项目,包括配置SSL证书、设置代理和负载均衡的示例。
47 2
|
1天前
|
JavaScript 前端开发 测试技术
Vue.js开发者必看!Vue Test Utils携手端到端测试,打造无懈可击的应用体验,引领前端测试新风尚!
【8月更文挑战第30天】随着Vue.js的普及,构建可靠的Vue应用至关重要。测试不仅能确保应用质量,还能提升开发效率。Vue Test Utils作为官方测试库,方便进行单元测试,而结合端到端(E2E)测试,则能构建全面的测试体系,保障应用稳定性。本文将带你深入了解如何使用Vue Test Utils进行单元测试,通过具体示例展示如何测试组件行为;并通过Cypress进行E2E测试,确保整个应用流程的正确性。无论是单元测试还是E2E测试,都能显著提高Vue应用的质量,让你更加自信地交付高质量的应用。
|
2天前
|
Kubernetes jenkins 持续交付
jenkins学习笔记之二十一:k8s部署jenkins及动态slave
jenkins学习笔记之二十一:k8s部署jenkins及动态slave
|
2天前
|
jenkins Java Shell
jenkins学习笔记之十三:配置SonarScanner扫描Java项目
jenkins学习笔记之十三:配置SonarScanner扫描Java项目
|
2天前
|
jenkins Java 关系型数据库
jenkins学习笔记之十二:sonarqube9.9、SonarScanner4.8部署
jenkins学习笔记之十二:sonarqube9.9、SonarScanner4.8部署
|
14天前
|
缓存 前端开发 JavaScript
前端框架选择指南:React vs Vue vs Angular
React、Vue与Angular是主流前端框架,各有千秋。React专注视图层,学习曲线平缓,生态丰富,适用于中大型项目;Vue简洁易学,模板直观,内置状态管理,适合中小项目及快速原型;Angular全栈框架,结构严谨,适合大型企业应用。React需手动处理状态管理,Vue提供完整CLI加速开发,Angular虽学习曲线陡峭但提供全套解决方案。性能方面,三者均利用虚拟DOM优化渲染。社区支持上,React最为庞大,Vue活跃度高,Angular有Google背书。选型应基于项目需求、团队技能及维护考量。
32 0
|
4月前
|
JavaScript API
【vue实战项目】通用管理系统:api封装、404页
【vue实战项目】通用管理系统:api封装、404页
62 3
|
4月前
|
人工智能 JavaScript 前端开发
毕设项目-基于Springboot和Vue实现蛋糕商城系统(三)
毕设项目-基于Springboot和Vue实现蛋糕商城系统
下一篇
云函数