jenkins 安装配置

# jenkins 安装配置

centOs7下 git+github+nginx+nodeJs+vue
实现前端项目自动化部署

# 安装 jdk

参考文章 (opens new window) 参考文章 (opens new window)
(yum update 看个人情况执行) yum install java-1.8.0-openjdk

# 安装 nginx

  1. 安装 nginx 相关依赖环境
    yum -y install make zlib zlib-devel gcc-c++ libtool openssl openssl-devel
  2. 安装 nginx
    安装已下载的 nginx 包(tar -zxvf nginx-1.14.0.tar.gz)
    tar -zxvf nginx-1.14.0.tar.gz
  3. 编译安装
  ./configure
  make
  make install

  以上操作后Nginx将被安装在/usr/local/nginx目录下
  1. nginx 相关操作
    参考文章 (opens new window) 参考文章 (opens new window)

    进入 /usr/local/nginx/sbin

  ./nginx   启动Nginx
  ./nginx -s stop   立即停止Nginx并退出
  ./nginx -s quit   优雅停止Nginx并退出
  ./nginx -s reload 重启nginx

# 安装配置 jenkins

参考文章 (opens new window) 参考文章 (opens new window) jenkins 安装包下载 (opens new window)

  1. 安装插件
    如果下载慢 修改 /var/lib/jenkins/hudson.model.UpdateCenter.xml 文件中的地址为国内镜像,地址:

    https://mirrors.tuna.tsinghua.edu.cn/jenkins/updates/update-center.json
    
    http://mirror.esuni.jp/jenkins/updates/update-center.json
    

# 配置 jenkins

  • github 配置
    githubhook 配置 (opens new window)

  • Publish Over SSH 配置
    Publish Over SSH 配置 (opens new window)
    安装提示配置即可(注意 Hostname 不要带 http/https)

  • nodeJs 安装
    本次直接在 jenkins 中安装(先安装 nodeJs 插件),在全局工具配置中选择对应版本,勾选自动安装即可

  • git 配置
    如果服务器有安装可以不用勾选自动安装,全局工具配置中配置对应 git 路径即可(whereis git 带 bin 目录的),如果没有安装可以勾选自动安装

# jenkins 项目配置

  1. 新建一个任务(按个人所需),本次选择自由风格、名称 vueDemo

  2. 进入项目面板 选择配置 对项目任务进行配置

  3. general 本次选择 github 项目 将项目地址复制过来即可(github 对应项目地址栏 不带.git 后缀的)

  4. 源码管理 本次选 git
    将 github 仓库路径复制过来即可(带.git 后缀的)
    Credentials 添加 github 账号及密码 填写一个描述作为标识
    源码库浏览器 选 githubweb url 填 github 项目地址栏路径

  5. 构建触发器 选 GitHub hook trigger for GITScm polling

  6. 构建环境 选 secret text 变量名随意 凭据 github 配置步骤中生成的那个 还需勾选 Provide Node & npm bin/ folder to PATH 选择对应 node(默认选中的即可)

  7. 构建 选执行 shell(看个人所需)

      本次所用:
      echo $PATH
      node -v
      npm -v
      npm install
      npm run build
      rm -rf vueDemoWeb
      mv dist vueDemoWeb
    
  8. 构建后执行 本次选 send build artifacts over ssh
    看个人情况 Remove prefix 本次为 dist/
    Remote directory 为 /
    Exec command:

    rm -rf /usr/local/nginx/html/vueDemoWeb
    \cp -rf /var/lib/jenkins/workspace/vueDemo/vueDemoWeb /usr/local/nginx/html/
    

# 后语

到这 jenkins 基本已配置完成了,如果前面配置没出问题的话,打包后的文件已经可以放到 nginx 服务器上。只需在配置一下 nginx 就可以说实现通过:

git 上传代码到 github 仓库
触发 github webhook 事件
执行 jenkins 构建操作
构建成功后,将文件复制到 nginx 服务下
从而实现项目的持续发布、构建、部署;

# 常见问题

# jenkins npm install 慢

查看当前镜像源
npm get registry

切换镜像源 为淘宝镜像(国内)
npm config set registry https://registry.npmmirror.com

# 参考文章

SVN 怎么触发 Jenkins 自动构建 (opens new window)

CentOS 7 下 GitLab 安装部署教程 (opens new window)

gitlab (opens new window)

Jenkins 自动化构建 – 前端 VUE 项目 (opens new window)

jenkins github webhook 配置 (opens new window)

jenkins gitlab 配置 (opens new window)