Skip to content

部署 web 项目

centos7 安装 node.js 环境

1、下载 node.js

下载地址:https://nodejs.cn/download/

WARNING

jenkins 最高支持 node 版本到 16 ,使用 16 以上 npm run build 时会报错

2、上传文件

上传压缩包到服务器 /usr/local/lib/node 路径下

3、解压 nodejs 压缩包

sh
tar -xvf node-v16.16.0-linux-x64.tar.xz

4、配置环境变量

sh
# 打开配置文件
vim /etc/profile

# 添加配置
export NODE_HOME=/usr/local/lib/node/node-v16.16.0-linux-x64
export PATH=$NODE_HOME/bin:$PATH

# 重新加载profile文件
source /etc/profile

# 检查是否配置正确
node -v
npm -v

安装 node.js 插件

配置 node.js

配置 Git

部署 web 项目 (当前服务器)

TIP

jenkins 构建的项目包发布在当前的服务器中

这里以 vue 项目打包作为参考

新建任务

输入任务名,构建自由风格项目

配置 git 仓库

点击确定进入配置页面后,到 源码管理 选择 Git,填写 Repository URL (git 仓库地址),添加和选择 Credentials(认证信息,git 的账号密码),Branches to build (需要构建的分支)

配置凭证

如果没有配置 Credentials(认证信息,git 的账号密码),需要添加 git 账户信息。

用户名、密码 为必填

ID、描述 为选填

其他配置为默认配置

选择构建时 node 版本

配置完成后无报错信息,到 构建环境 ,勾选 Provide Node & npm bin/ folder to PATH

构建时执行的 shell 命令

到 构建 点击 增加构建步骤 , 选择 Execute shell 选项,在文本框做添加打包命令,添加完成后,点击保存。

sh
#!/bin/bash
echo "当前用户:"
whoami

echo "node版本:"
node -v

echo "npm版本:"
npm -v

echo "***npm install***"
npm install #安装

echo "***删除上一个代码包***"
rm -rf dist #删除上一个代码包

echo "***npm run build***"
npm run build #打包

echo "***清空发布目录***"
sudo rm -rf /www/wwwroot/laucoya.com/record/* #清空发布目录

echo "***移动到发布目录***"
sudo mv dist/* /www/wwwroot/laucoya.com/record #直接移动到发布目录

启动任务,检查是否正常运行

点击启动,启动打包程序,左侧构建执行状态会展示当前任务,点击进入当前任务,进入到详情页面。

到详情页面后点击相关链接第一条,第一条为当前任务信息。

进入任务信息页后,点击控制台输出,查看当前打包过程,结果为 Finished: SUCCESS ,打包成功

打包成功后能够在工作空间中看到 dist 文件夹

部署 web 项目 (远程服务器)

TIP

jenkins 构建的项目包发布在其他的远程服务器中

这里以 vue 项目打包作为参考

安装插件,Publish Over SSH

发布到远程需要安装Publish Over SSH插件

配置 Publish Over SSH

点击新增,填写 Name(名称)、Hostname(服务器 IP)、Username(服务器用户名)、Remote Directory(远程目录)

点击高级 , 高级中勾选 Use password authentication, or use a different key ,在 Passphrase / Password 中填写服务器密码。

点击右下角 Test Configuration ,测试服务器是否连接成功。连接成功点击保存。

构建时执行的 shell 命令

到 构建 点击 增加构建步骤 , 选择 Execute shell 选项,在文本框做添加打包命令,添加完成后,点击保存。

sh
#!/bin/bash
echo "当前用户:"
whoami

echo "node版本:"
node -v

echo "npm版本:"
npm -v

echo "***npm install***"
npm install

echo "***删除上一个代码包***"
rm -rf dist

echo "***npm run build***"
npm run build #打包

echo "***进入dist文件***"
cd dist

echo "***压缩dist中所有文件***"
tar -zcvf dist.tar.gz * #压缩dist文件

echo "***返回上一级***"
cd ../

echo "***当前操作路径***"
pwd

配置 构建后操作 > 选择 增加构建后操作步骤 > 选择 Send build artifacts over SSH

sh
cd /www/wwwroot/default #进入远程服务器的目录

tar -zxvf dist.tar.gz -C dist/ #解压dist文件到dist文件夹

rm -rf dist.tar.gz #删除dist文件