vue项目-jekins自动化构建踩坑

根本环境

• 操作系统： Linux version 5.10.60-9.al8.x86_64 (mockbuild@x86-006.build.alibaba.eu6) (gcc (GCC) 10.2.1 20200825 (Alibaba 10.2.1-3 2.30)
• JDK: jdk1.8.0_131
• vue： 2.6.10
• Jenkins: 2.319.3

jekins 装置

• 备份官方默许更新源文件

    sudo wget -O /etc/yum.repos.d/jenkins.repohttps://pkg.jenkins-ci.org/redhat-stable/jenkins.repo

• 导入GPG密钥

    sudo rpm --import<https://jenkins-ci.org/redhat/jenkins-ci.org.key>

• 装置

    sudo yum install jenkins

• 检查jekins服务状态

    systemctl status jenkins.serve

修正装备

• 端口 jekins默许是8080端口 项目8080有其他的服务使用 这儿使用8010 要提前在阿里云敞开8010端口
• 修正装备 对/etc/sysconfig/jenkins进行操作

    vim /etc/sysconfig/jenkins
    # 用户
    JENKINS_USER="root"
    #监听端口 JENKINS_PORT="8010"

• 增加java路径

    # 查询java路径
    which java
    vim /etc/init.d/jenkins
    #增加java路径
    candidates="
    /usr/local/java/jdk1.8.0_131/bin/java
    "

发动

    systemctl start jenkins

拜访

1.项目发动之后能够根据ip加端口号拜访 2.装备域名拜访 在nginx装备下增加jekins装备

    cd /etc/nginx/conf.d/
    # 增加jekins装备
    vi jenkins.conf

3. jekins装备

    server {
    listen 80;
    # 域名拜访
    server_name  jekins.test.aggie.cn;
    charset utf-8;
    location /{
        # 定位到本机8010端口（端口已在阿里云敞开）
        proxy_pass http://127.0.0.1:8010;
        proxy_redirect off;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For   $proxy_add_x_forwarded_for;
        proxy_pass_request_headers on;
    }
}

• 在浏览器输入http://ip:8010， ip:服务器外网ip地址 例：47.16.24.xxx:8888 域名: jekins.test.aggie.cn

5. 会呈现jekins初始页面

6 过一会 提示你输入办理员暗码

    vi /var/lib/jenkins/secrets/initialAdminPassword

把暗码仿制出来填入页面即可进入jekins

装置插件

1. 装置推荐插件(比较耗时 有时候还会装置失败)

2. 创立办理员账户

3. 装备实例（保存之后就会进入jekins办理页面）

装备项目

• 因为项目会布置在不同的服务器 所以还需要装置一些插件

1. 检查服务器是否装置git

    which git

装置以后会呈现下图

2. 装置 Git Parameter Plug-In NodeJS

Git Parameter Plug-In 能够挑选git分支进行构建 Node JS 用来履行npm脚本 3 装置 Publish over SSH 用来构建完结推送远程服务器

本服务器构建

新建使命

项目名称

输入项目名称 点击构建一个自由风格的软件项目 然后点击确定

装备项目构建参数（设置不同分支发布）

因为前面咱们装备了插件【Git Parameter】 能够挑选git参数 输入名称 描绘 挑选分支（branch）或许标签(tag)进行构建

源码办理

• 挑选git 然后输入对应项目的地址

  

• 增加jekins凭据 用来拉去gitlab代码

• 增加凭据 挑选大局凭据 类型挑选有很多种 我这儿挑选账号和暗码 然后输入 用户名 暗码 （id和描绘能够不填）然后点击增加

• 挑选方才增加的凭据

• 增加构建的分支 我这儿增加了两个 用来挑选不同的分支构建

构建环境

• 挑选Provide Node & npm bin/ folder to PATH（插件现已装置Nodejs）

  

• 挑选node装备

构建

• 这儿挑选履行shell

  

• 输入对应的脚本

    npm install
    rm -rf ./dist/*
    npm run build:prod
    rm -rf /pms-web/web/dist
    cp -rf ./dist /pms-web/web/

npm install 装置依赖

rm -rf ./dist/* 清空项目dist文件夹

npm run build:prod 履行vue项目build

rm -rf /pms-web/web/dist 清空服务器dist文件夹

cp -rf ./dist /pms-web/web/ 仿制粘贴打包完的项目到服务器指定的路径

点击保存

项目初始化

返回使命列表就能看到咱们创立的使命 点击进入项目

点击作业空间 此时作业空间为空 提示需要先构建一次

点击 Build with Parameters 会让咱们挑选对应的分支进行构建

挑选分支进行构建 第一次构建会比较慢

通过构建前史咱们能够看到构建进程

这个时候咱们的作业空间就现已东西了

推送远端服务器

因为项目需要咱们要把代码布置到另一台服务器上 这个时候咱们前面装置的插件Publish over SSH来进行远端服务器推送 新建使命进程和上边一样 接下来咱们看一下推送代码到其他服务器

装备Publish over SSH

1.挑选系统办理 ——系统装备

2. 找到 Publish over SSH 点击新增按钮

3.装备远端服务器

• name 自己命名
• hostname 填写服务器地址
• username 连接服务器的用户名
• Remote Directory 定位到服务器的哪个目录 装备完结之后点击高档装备暗码

• 写入 Proxy password 端口是22

• 最后点击保存

装备项目

新建使命和前面都一样 最后咱们装备一下远端服务区构建 其实便是把本地的dist放入其他服务器

• 进入使命点击设置

• 在构建这儿制作 装置依赖 build 项目就行了

  

然后挑选构建后项目 点击Add Serve

在SSH Server Name挑选方才创立的服务

然后装备项目在服务器放的方位

• Source files 打包的文件目录
• Remove prefix 是否删去文件夹 dist只仿制里边的文件 根据nginx装备去选 我这快不需要删去dist
• Remote directory 服务器项目寄存的目录 根据nginx装备填写

然后点击保存

这样就能够把项目布置到知道服务器了