linux安装jenkins实现自动化部署nuxt.js、vue、egg

前情提要：最近帮朋友开发了一套网站，由于前后端都是自己一个人做，部署也是自己弄，所以在这里记录下，下次再有需要部署的项目可以直接用，不用再去挨着查找文章；
我前台项目采用了nuxt.js框架，管理系统使用了vue框架，后台服务使用了node.js的egg框架，所以本篇文章将介绍在linux上安装node.js、pm2、nginx、mongodb以及jekins等，以及相关配置实现自动化部署； 我的linux系统是 centos 7.6；

一、linux上安装jdk（在linux控制台中执行下面命令）： 

yum install -y java-1.8.0-openjdk-devel.x86_64 #安装命令
java -version  #查看版本

  # 你可以在 /usr/lib/jvm 目录下找安装目录

 

二、linux安装node.js  

2.1、node 下载 参考网站(https://blog.csdn.net/weixin_40861707/article/details/109455582);可以在这里查找你想安装的版本

  cd /etc/sysconfig #进入到sysconfig目录

  wget https: // nodejs.org/dist/v14.16.1/node-v14.16.1-linux-x64.tar.gz #下载安装包

  tar -zxvf node-v14.16.1-linux-x64.tar.gz #解压安装包

2.2、为node与npm建立软连接（注意红色部分是否是你node的安装路径）

ln -s /etc/sysconfig/node-v14.16.1-linux-x64/bin/node /usr/bin/node
ln -s /etc/sysconfig/node-v14.16.1-linux-x64/bin/npm /usr/bin/npm

2.3、下载cnpm并建立软连接

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

ln -s /etc/sysconfig/node-v14.16.1-linux-x64/bin/cnpm /usr/bin/cnpm

2.4、服务器配置node环境变量（不配置jenkins无法正常执行pm2命令）

vim /etc/profile  # 打开配置文件  a键进入编辑模式

# 在最后面添加node环境变量（注意NODE_HOME后面的路径是否为你node的安装路径）
export NODE_HOME=/etc/sysconfig/node-v14.16.1-linux-x64
export PATH=$PATH:$NODE_HOME/bin

# 按Esc 后输入 :wq 保存退出

source /etc/profile # 然后执行这个命令使配置文件立即生效

注意：上面方法新的shell或重启服务器后无法使用之前配置的环境变量，要用需再次执行source /etc/profile让它生效；永久环境变量添加的方法是需运行 vi ~/.bashrc 打开配置文件，添加环境变量； 再执行 source ~/.bashrc 立即生效；

 

您可能需要用到的命令;

whereis node-v14.16.1-linux-x64.tar.gz   #查询安装包路径
pwd   #查看当前所处路径
ln -s    #建立软连接
ln -snf  #覆盖软连接
查看已经建立的软连接： 在 /usr/local/bin/   目录执行： ls -lR

 

三、linux安装git 

yum install git

git version #查看git版本

whereis git #查看git安装路径

 

四、linux安装nginx

4.1、确认系统属否安装了gcc、pcre-devel、zlib-devel、openssl-devel

yum -y install gcc pcre-devel zlib-devel openssl openssl-devel

4.2、安装nginx

yum install nginx # 安装命令

 
    
      nginx -v # 查看版本 
     
 
     
       rpm -ql nginx # 查看路径 
      
/usr/sbin/nginx #启动nginx 
      
 
      
#第一次启动nginx失败： 出现这种情况一般是80端口被占用，使用 sudo fuser -k 80/tcp 命令关闭80端口即可 参考： 
      https://www.cnblogs.com/xpybsh/p/13694748.html 
      
     
   

4.3、启动成功后浏览地址访问直接访问IP

 

4.3、nginx常用命令

/usr/sbin/nginx -s stop #停止

/usr/sbin/nginx -s reload #重启

nginx安装目录：/usr/local/nginx nginx

日志查看： vim /var/log/nginx/error.log 

打开nginx配置文件：vim /etc/nginx/nginx.conf 

测试配置文件是否正确：nginx -t 

 

  查看nginx位置：whereis nginx

 

 4.4、nginx配置（这里是我项目的配置，根据自己的项目差异配置会有差别）

运行 vim /etc/nginx/nginx.conf  打开配置文件后按a键进入编辑模式，配置以下内容后点击Esc键输入:wq保存后退出，再执行  nginx -t  检查配置文件是否存在问题，

没问题就执行： /usr/sbin/nginx -s reload 重启nginx；

    upstream nodenuxt {
        server 127.0.0.1:3001; #nuxt项目
        keepalive 64;
    }
    server {
        listen 80; # 监听端口80
        server_name  nuxt.xxx.com; # 匹配域名(前台nuxt项目)
         # 代理腾讯接口
        location ^~ /api/getonline {
             rewrite ^/api/(.*)$ /$1 break;
             proxy_pass https://webpresence.qq.com;
        }
        # 代理前台接口
        location ^~ /api/nk {
             proxy_pass http://127.0.0.1:7001;
        }
        # 代理管理系统接口
        location ^~ /api/yk {
             proxy_pass http://127.0.0.1:7001;
        }
        # 代理图片地址
        location ^~ /public/avatar/upload {
             proxy_pass http://127.0.0.1:7001;
        }
        location / {
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            proxy_set_header Host $host;
            proxy_set_header X-Nginx-Proxy true;
            proxy_cache_bypass $http_upgrade;
            proxy_pass http://nodenuxt; # 反向代理地址
        }

    }
    server {
        listen 80;
        server_name manage.xxx.cn; # 管理系统（vue项目）
        location / {
            autoindex on;
            root /home/webapps/manage;
            index index.html;
            try_files $uri $uri/ /index.html;
        }
        # 代理图片地址
        location ^~ /public/avatar/upload {
             proxy_pass http://127.0.0.1:7001;
        }
        location = /favicon.ico {
            log_not_found off;
            access_log off;
        }
    }

 

 

 

五、linux安装pm2

sudo cnpm install -g pm2  #安装命令
sudo ln -s /etc/sysconfig/node-v14.16.1-linux-x64/bin/pm2 /usr/local/bin/ #建立软连接（注意pm2的安装地址）
vim /etc/profile #打开配置文件
export PM2_HOME=/root/.pm2/ #添加环境变量，加在配置文件最后按 Esc后输入：wq保存退出
source /etc/profile # 然后执行这个命令使配置文件立即生效

pm2常用命令：

# 启动项目
pm2 start npm --name "xxx" -- run start
# 查看所用已启动进程：
$ pm2 list
# 重启某一个进程：
$ pm2 restart XXX
# 停止某一个进程：
$ pm2 stop XXX
# 删除某一个进程：
$ pm2 delete XXX
# 查看某个进程详情
pm2 show 0 或者 # pm2 info 0 #查看进程详细信息，0为PM2进程id

jekins  使用PM2 启动项目后，在控制台无法看到进程的解决方案：
https://www.jianshu.com/p/3c628003a4e5

清空日志信息：pm2 flush

 

六、linux安装MongoDB数据库

我的后台服务数据存储用到了mongodb。

注意：（首先服务器记得开放27017端口，否则后续无法启动mogodb服务）

6.1、mongodb安装

# 下载安装包
wget https://fastdl.mongodb.org/linux/mongodb-linux-x86_64-rhel70-4.0.24.tgz
# 解压
tar -zxvf mongodb-linux-x86_64-rhel70-4.0.24.tgz
# 删除安装包
rm -rf mongodb-linux-x86_64-rhel70-4.0.24.tgz
# 将解压包拷贝到指定目录重命名为mongodb
mv mongodb-src-r4.2.8  /usr/local/mongodb
# cd 移动到安装目录
cd /usr/local/mongodb/
# 创建mongodb数据存储文件和日志文件
mkdir data
mkdir logs
cd ./logs
touch mongodb.log
cd ../
mkdir etc
cd etc
touch mongodb.conf

6.2、修改配置文件

# 打开配置文件
vim mongodb.conf

# 添加下列内容
·········································
#数据库路径
dbpath=/usr/local/mongodb/data
#日志输出文件路径
logpath=/usr/local/mongodb/logs/mongodb.log
#错误日志采用追加模式
logappend=true
#启用日志文件，默认启用
journal=true
#这个选项可以过滤掉一些无用的日志信息，若需要调试使用请设置为false
quiet=true
#端口号 默认为27017
port=27017
#允许远程访问
bind_ip=0.0.0.0
#开启子进程
fork=true
#开启认证，必选先添加用户，先注释（不用验证账号密码）
#auth=true
·········································

#添加后按Esc输入:wq保存退出
source mongodb.conf # 执行配置生效

6.3、配置mongodb环境变量

# 将mongodb服务加入环境变量
vi /etc/profile #打开配置文件

# 加在文件最后
export MONGODB_HOME=/usr/local/mongodb
export PATH=$PATH:/usr/local/mongodb/bin 

#添加后按Esc输入:wq保存退出

source /etc/profile #执行配置生效

6.4、启动mongodb服务(在mongodb的安装目录下的bin目录下启动服务)

cd /usr/local/mongodb/bin

./mongod --config /usr/local/mongodb/etc/mongodb.conf

查看mongodb是否已经启动成功

netstat -lanp | grep "27017"

 

6.5、操作mongo数据库、添加用户、安全认证

配置了环境变量的前提下，任意目录下，输入命令mongo即可进入数据库，否则需要在mongodb安装目录下的bin目录下使用 ./mongo 命令

mongo
show dbs  # 查看当前所有数据库。

use admin 
db
# 创建账户
db.createUser({user:"root",pwd:"admin001",roles:[{role:"root",db:"admin"}]})

6.6、授权成功后，关闭mongo服务

db.shutdownServer()

exit   #退出mondodb命令行

# 打开配置文件，放开auth=true注释
vim /usr/local/mongodb/etc/mongodb.conf

source  mongodb.conf  #执行配置生效

# 启动数据库
cd /usr/local/mongodb/bin
./mongod --config /usr/local/mongodb/etc/mongodb.conf
# 进入mongodb命令行
mongo
show dbs # 此时看不到任何数据库表，说明我们的安全认证用户配置生效了
use admin  
db.auth('root','admin001') # 输出1，说明验证成功

 

mongodb插入一条数据（此项可忽略）

# 向用户表添加一条初始用户数据用于管理系统登录
# use myDbData
# db.user.save({ name: 'admin', account: 'admin001', password: 'admin001',isDelete:NumberInt(0) })

客户端远程连接数据库参考：https://blog.csdn.net/qq_41107231/article/details/108028319

 

七、在服务器上创建放项目代码的目录

cd /home
mkdir webapps   # 代码全放这里/home/webapps
cd webapps # 进入该文件夹
mkdir client # 创建放前台项目的文件夹
mkdir manage # 创建放管理系统项目的文件夹
mkdir serve # 创建放服务端项目的文件夹

 

 

八、linux上安装 jenkins

8.1、安装jekins

sudo wget -O /etc/yum.repos.d/jenkins.repo https://pkg.jenkins.io/redhat-stable/jenkins.repo

sudo rpm --import https://pkg.jenkins.io/redhat-stable/jenkins.io.key

yum install jenkins

rpm -ql jenkins  # 查找jenkins安装路径

 

8.2、修改jenkins配置文件；修改默认端口与目录权限

vim /etc/sysconfig/jenkins  # 打开jenkins配置文件  

打开配置文件后按 a 进入编辑模式，修改下方两处：

$JENKINS_USER="root"
JENKINS_PORT="8080"

修改成功后按esc键输入 :wq 保存退出。

8.3、运行下方命令启动jenkins服务（出现OK表示Jenkins启动成功）

service jenkins start

然后在浏览器输入 你服务器的外网ip:8080 进入Jenkins登录页面。（注：访问前确保服务器开放了8080端口）

 8.4、服务器控制台输入下面命令找到jenkins密码

tail /var/lib/jenkins/secrets/initialAdminPassword

在jekins网站中输入密码登录后选择要安装的插件后进行安装（可以选择推荐安装的插件）。

 

8.5、jekins中配置git插件地址（我自动部署jenkins会去拉我git仓库的代码）

打开jenkins主页面–>系统管理–>全局工具配置  下面，在git一栏中name使用git即可, Path to Git executable 中填写linux上git的安装地址,(即whereis git的结果) 保存即可。

8.6、jenkins安装node.js插件

在jenkins主页面–>系统管理–>插件管理-> 选择node.js经行安装

安装后：jenkins主页面–>系统管理–>全局工具配置（配置下方信息）

 

 

 

 8.7、jekins新建任务与配置

在jekins首页，点击“新建任务”然后操作如下步骤：

 点保存后进入到任务配置界面，首先配置项目git仓库地址;

然后配置任务构建环境：

 

 最后配置构建执行的shell：
1、vue项目的构建命令：

 

 2、nuxt.js执行的shell

rm -rf /home/webapps/client/*  # 删除之前的所有文件
cnpm install # 安装依赖
cnpm run build # 打包项目
tar czvf nuxt_build_web.tar.gz .nuxt static nuxt.config.js package.json config # 压缩文件
mv ./nuxt_build_web.tar.gz /home/webapps/client # 移动压缩包到指定目录
rm -rf ./nuxt_build_web.tar.gz # 删除当前文件夹下的压缩包（jenkins目录下的压缩包）
cd /home/webapps/client # 移动到项目所在目录
tar xzvf nuxt_build_web.tar.gz # 解压压缩包
rm -rf nuxt_build_web.tar.gz # 删除压缩包
cnpm install # 安装依赖
source ~/.bashrc
source /etc/profile
pm2 restart "kangyu-nuxt-client"  # 重启进程（非第一次构建执行这个命令重启）
# pm2 start cnpm --name "kangyu-nuxt-client" -- run start # 使用pm2启动项目(第一次构建时执行这个命令启动)

3、egg项目构建执行的shell

BUILD_ID=DONTKILLME
rm -rf ./app/public/*  # 先删除工作空间public下所有静态资源
cp -R ./* /home/webapps/serve  # 拷贝工作空间中文件到指定目录
cd /home/webapps/serve
cnpm install
cnpm run stop
cnpm run start

 

 

九、配置开机启动命令（服务器重启自动启动某些项目）

9.1、开机pm2启动nuxt项目

• 运行 pm2 startup，即在/etc/init.d/目录下生成pm2-root的启动脚本，且自动将pm2-root设为服务。
• 运行 pm2 save，会将当前pm2所运行的应用保存在/root/.pm2/dump.pm2下，当开机重启时，运行pm2-root服务脚本，并且到/root/.pm2/dump.pm2下读取应用并启动。

9.2、开机启动nginx、mogodb、egg

1、新建脚本文件

cd /home
mkdir custom
vi /home/custom/auto_run_script.sh

2、在脚本文件中添加需执行的shell

# 开机启动nginx
/usr/sbin/nginx
# 开机启动mogodb
sudo /usr/local/mongodb/bin/mongod --config /usr/local/mongodb/etc/mongodb.conf
# 开机启动egg服务
cd /home/webapps/serve
cnpm run start

3、wq保存后执行下方命令赋予可执行权限

chmod +x /home/custom/auto_run_script.sh

4、将脚本添加到 /etc/rc.d/rc.local 文件中

$ vim /etc/rc.d/rc.local # 打开配置文件

/home/custom/auto_run_script.sh  #添加需要执行的脚本

$ source /etc/rc.d/rc.local # 生效

在Centos7下，rc.local文件开机默认是不执行的

必须运行 chmod +x /etc/rc.d/rc.local