一、Node.js简介

Node.js是在前端页面开发中十分受欢迎的,它是一套用来编写高性能网络服务器的JavaScript工具包,简单说,这里的nodejs项目指的就是前端项目!

二、实验环境

Jenkins自动化部署nodejs项目(前端项目)_第1张图片

三、实验步骤

1.安装nodejs插件

"系统管理"--"管理插件"--"可选插件"
Jenkins自动化部署nodejs项目(前端项目)_第2张图片

2.Linux系统安装nodejs

(1)去nodejs官网下载最新包

官网下载地址:https://nodejs.org/dist/latest/
wget https://nodejs.org/dist/latest/node-v11.14.0-linux-x64.tar.gz

Jenkins自动化部署nodejs项目(前端项目)_第3张图片

(2)解压安装

tar xvzf node-v11.14.0-linux-x64.tar.gz -C /opt

(3)修改环境变量

vim /etc/profile
export PATH=/opt/node-v11.14.0-linux-x64/bin:$PATH

(4)刷新环境变量,使其生效

source /etc/profile

(5) 安装cnpm与配置淘宝镜像

npm install -g cnpm --registry=https://registry.npm.taobao.org

Jenkins自动化部署nodejs项目(前端项目)

(6) 查看npm,cnpm,node版本号

Jenkins自动化部署nodejs项目(前端项目)_第4张图片

npm和 cnpm区别:
npm(node package manager)是nodejs的包管理器,用于node插件管理(包括安装、卸载、管理依赖等) npm安装插件过程:从http://registry.npmjs.org下载对应的插件包(该网站服务器位于国外,所以经常下载缓慢或出现异常)。
cnpm是国内的淘宝团队分享的镜像,同步频率目前为 10分钟 一次以保证尽量与官方服务同步。
cnpm跟npm用法完全一致,只是在执行命令时将npm改为cnpm。

3.Jenkins 上nodejs 配置

"系统管理"--"全局工具设置"---" NodeJS 安装"

Jenkins自动化部署nodejs项目(前端项目)_第5张图片

4.NodeJS项目配置

(1)新建任务

Jenkins自动化部署nodejs项目(前端项目)_第6张图片

(2)先输入任务名称,再选择构建项目类型,最后点击确定

Jenkins自动化部署nodejs项目(前端项目)_第7张图片

注意:这里选“构建一个自由风格的软件项目”

(3)丢弃旧的构建

Jenkins自动化部署nodejs项目(前端项目)_第8张图片

(4)svn设置

Jenkins自动化部署nodejs项目(前端项目)_第9张图片

(5)构建环境设置

Jenkins自动化部署nodejs项目(前端项目)_第10张图片

(6)构建:执行shell,保存

source /etc/profile #声明环境变量
cnpm cache verify #清除缓存
cnpm install #安装cnpm
cnpm run build:prod -- --dev #构建项目
zip -r dist.zip dist #打包成.zip格式

Jenkins自动化部署nodejs项目(前端项目)_第11张图片

5.构建nodejs项目

(1)配置完成后,在该项目下,点击立即构建

Jenkins自动化部署nodejs项目(前端项目)_第12张图片

(2)在构建历史最新一个,右键选择控制台输出,查看构建过程

Jenkins自动化部署nodejs项目(前端项目)_第13张图片
Jenkins自动化部署nodejs项目(前端项目)_第14张图片
Jenkins自动化部署nodejs项目(前端项目)_第15张图片

6.查看项目构建结果

Jenkins自动化部署nodejs项目(前端项目)_第16张图片

Jenkins自动化部署nodejs项目(前端项目)

温馨提示:

1.建议nodejs插件在Linux系统提前安装上,在线安装会非常慢。
2.npm和cnpm区别来自 https://blog.csdn.net/chi1130/article/details/72773278, 所以这里采用的是cnmp命令安装插件。
3.cnpm run build:prod -- --dev 这条命令以公司具体svn设置为准,仅供参考。
4.因本公司只需要对nodejs项目打包即可,这篇博客没写上传服务器的相关配置,如要需要,可参考 https://www.jianshu.com/p/90c04ceff2da