jekins部署前端vue、react

服务器安装node

无论是vue、react还是angular,node环境都是必须的。
我们使用nvm来安装node

服务器安装yarn

因为前端的包管理工具,现在大都需要yarn支持,比如我接下来演示的项目。
当然如果你用的是npm,则可以忽略此步骤。

npm install -g yarn

jekins安装nodeJS插件

系统管理>插件管理>添加 添加后,记得重启生效
jekins部署前端vue、react

系统管理>全局工具配置>NodeJs>新增
jekins部署前端vue、react
记得给node安装目录一个权限,否则将会配置失败

chmod 777 /root

jekins部署前端vue、react

给jekins同步服务器的环境变量

方便使用服务器全局工具, 这样jekins创建的项目里可以直接使用服务器全局软件
系统管理>系统配置>全局属性>新增
jekins部署前端vue、react

这个配置项的值,就是服务器环境变量的值 输入以下命令,即可查看

[root@VM-24-8-centos ~]# echo $PATH
/root/.nvm/versions/node/v16.13.0/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/home/jdk1.8.0_141/bin:/root/bin

安装git

因为我们的项目在github,需要从git仓库上拉去,所以git工具是必须的。
一般项目都是在git,如果你的项目不在git也可以忽略此步骤。

yum install -y git

安装nginx

因为我需要把前端项目部署到nginx中

yum install nginx -y
systemctl start nginx

jekins部署前端vue、react
记得给nginx容器一个权限,否则后续mv操作会失败

chmod 777 /usr/share/nginx/html

创建一个项目

项目类型:构建一个*风格的软件项目
jekins部署前端vue、react

源码管理:选择git,填写相关信息,地址、账号、分支
jekins部署前端vue、react

构建:选择执行shell

yarn
yarn build
rm -rf /usr/share/nginx/html/*
mv dist/* /usr/share/nginx/html/

jekins部署前端vue、react

立即构建

jekins部署前端vue、react

访问看效果

jekins部署前端vue、react

上一篇:持续集成部署Jenkins工作笔记0006---运行Jenkins主体程序并初始化


下一篇:tomcat启用https