有个 vue 项目，打算放到 jenkins 上编译，顺便加上 webhook 提交代码后自动编译发布到对应的远程服务器 nginx 下。
jenkins webhook 看这里
一、配置 jenkins
系统管理 -> 全局工具配置 安装 nodejs 模块
二、编写 jenkins 执行脚本
-
第一步：首先需要初始化
下面是初始化脚本，只需要执行一次即可nodejs环境
#!/usr/bin/env bash
nodeName=$1
NODE_HOME=${JENKINS_HOME}"/tools/jenkins.plugins.nodejs.tools.NodeJSInstallation/"${nodeName}
PATH=$PATH:${NODE_HOME}/bin
export NODE_HOME PATH
echo "环境变量===========>"
echo "node_home "${NODE_HOME}
echo "path "${PATH}
registry=$2
nodeModules=${3//","/" "}
echo "开始初始化nodejs资源，请稍后..."
npm install cnpm -g --registry=${registry}
if [[ -n "${nodeModules}" ]];then
echo "要初始安装的模块:"${nodeModules}
cnpm install -g --unsafe-perm ${nodeModules} --save-dev
else
echo "没有要初始安装的模块"
fi
echo "环境版本===========>"
echo "node版本:"
node -v
echo "npm版本:"
npm -v
echo "cnpm版本:"
cnpm -v
echo "nodejs资源初始化完成"
参数说明 ：
-
参数一（$1）： 必须，使用的
nodejs名称，对应第一步在jenkins中安装的nodejs模块名称，如果你安装了多个版本的，会根据这个名称去定义环境变量来使用你指定的版本。我写的是nodejs-12.16.2 -
参数二（$2）：必须，指定的镜像站，我写的是
https://registry.npm.taobao.org -
参数三（$3）：非必须，指定要初始化安装的模块，记得模块用英文逗号分隔，我写的是
postcss-import,autoprefixer,cssnano,postcss-loader,stylus-loader,css-loader,autoprefixer-loader,style-loader,node-sass,sass-loader,chalk,each-async,indent-string,npm-lifecycle
我的 jenkins 的初始化配置
-
第二步：编写
jenkins执行项目编译的脚本
这个脚本会直接将 jenkins 工作空间所对应的项目代码进行编译，并且将编译好的文件发到对应的远程服务器 nginx 下，前提是你已经配置好了远程服务器的 nginx
前置条件：
- 远程服务器
nginx，必须先配置过公钥，实现了ssh 免密登录
#!/usr/bin/env bash
# node名称
nodeName=$1
# nginx代理的静态文件夹根目录
nginxSource=$2
# Jenkins项目名称
jenkinsProjectName=$3
# nginx 下项目名称
projectName=$4
# Jenkins编译项目相对路径
executableFolder=$5
# 运行服务器位置
serverDomain=$6
# 编译期额外安装的模块
nodeModules=${7//","/" "}
NODE_HOME=${JENKINS_HOME}"/tools/jenkins.plugins.nodejs.tools.NodeJSInstallation/"${nodeName}
PATH=${NODE_HOME}/bin:$PATH
export NODE_HOME PATH
echo "环境变量===========>"
echo "node_home "${NODE_HOME}
echo "path "${PATH}
echo "环境版本===========>"
echo "node版本:"
node -v
echo "npm版本:"
npm -v
echo "cnpm版本:"
cnpm -v
jenkins_home=${JENKINS_HOME}
# Jenkins的工作目录
jenkins_workspace=${jenkins_home}"/workspace"
#进入jenkins项目模块
cd ${jenkins_workspace}/${jenkinsProjectName}
#删除node包
rm -rf node_modules
#删除编译的可执行文件包
rm -rf ${executableFolder}
#删除上次编译重命名的编译包
rm -rf ${projectName}
#开始编译
if [[ -n "${nodeModules}" ]];then
echo "要安装的模块:"${nodeModules}
cnpm i ${nodeModules} --save
else
echo "没有要安装的模块"
fi
cnpm i
cnpm run build
mv ${executableFolder} ${projectName}
echo "projectName:${projectName}"
echo "serverDomain:${serverDomain}"
echo "nginxSource:${nginxSource}"
scp -o StrictHostKeyChecking=no -r ${projectName} ${serverDomain}:${nginxSource}
参数说明 ：
-
参数一（$1）： 必须，使用的
nodejs名称，对应第一步在jenkins中安装的nodejs模块名称，如果你安装了多个版本的，会根据这个名称去定义环境变量来使用你指定的版本。我写的是nodejs-12.16.2 -
参数二（$2）： 必须，远程服务器的
nginx代理的静态文件夹根目录。我写的是/root/data/nginx -
参数三（$3）： 必须，
jenkins下的项目名称，会根据这个寻找项目来编译。我写的是flow-dashboard-web -
参数四（$4）： 必须，远程服务器的
nginx下对应本项目的文件夹名称，一般都会将其配置到nginx的代理路径下。我写的是flow-dashboard-web -
参数五（$5）： 必须，
jenkins下项目编译后生成的可执行的文件夹名称。vue项目生成的一般为dist，我写的是dist -
参数六（$6）： 必须，远程服务器的地址，格式为
用户名@ip。我写的是root@root@172.26.80.xxx（ip最后3位我用x代替了） -
参数七（$7）： 非必须，编译期额外安装的模块，用英文逗号分隔。这里我没写，有一些通过
cnpm i 或 npm i无法直接安装的模块，就在这里写上，会额外开始安装
我的 jenkins 的项目配置
我没有用到 nodejs 插件
到这里已经全部完成，以上脚本可以适当简化，我将所有可变参数都提出来了，以后可以构建非 vue 项目。配合 webhook 实现了提交代码自动在 jenkins 编译，发布到了远程 nginx ，刷新页面即可
评论区