微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

jenkins自动构建前端项目(window,vue)

我们把一个多人协作的vue前端项目发布服务器,一般要经过以下步骤:

如果用jenkins来构建的话,只需要点击一次构建按钮,就可以自动完成以上的步骤了,而且根据需求,可以实现更多的功能

1.下载安装jenkin

1.1 java环境

jenkins需要运行在Java的环境中,所以前提是需要先安装jdk,测试jdk是否安装好,在命令行输入:java -version

在这里插入图片描述

1.2 下载jenkins

下载地址 jenkins下载

请添加图片描述

下载后点击安装,认端口是8080,然后打开 http://localhost:8080/,会出现如下页面

请添加图片描述

根据提示,输入管理员密码,,然后安装推荐插件,等待安装完毕后,然后设置登录用户名密码,就可以进入jenkins的页面了:

在这里插入图片描述

2 配置

2.1 配置远程服务器环境

首先下载插件publish over ssh:

  • 进入系统管理,然后点击插件管理

    在这里插入图片描述

  • 搜索插件,并安装

    在这里插入图片描述

  • 进入系统配置,配置远程服务器

    在这里插入图片描述

  • 配置远程服务器

    在这里插入图片描述

  • 点击右下角test configuration按钮,测试配置

2.3 配置node环境

3 构建

一些必要的插件安装配置过后,就可以开始构建项目了

3.1 新建项目

  • 点击新建项目

    在这里插入图片描述

  • 选择项目模板

    在这里插入图片描述

3.2 源码管理

  • 滚动页面源码管理配置项,选择git,此配置目的是自动从远程拉取代码

    在这里插入图片描述


    其中URL就是项目的git的地址,credentials是git登录凭据,还可以指定项目分支,
    其中credentials如果是第一次的话,需要点击添加完成配置后,才能选择:

    在这里插入图片描述

3.3 构建环境配置

我们这里是vue项目,所以选择node环境,并选择2.3配置node环境所配置的node版本:

在这里插入图片描述

3.4 构建

这一步jenkins会依次执行我们所配置的脚本,

  • 用脚本构建项目
    选择execute windows batch command,这里面就可以添加脚本,像在命令行一样

    在这里插入图片描述

  • 上传至服务器
    点击增加构建步骤,然后选择send files or execute commands over ssh

    在这里插入图片描述


    其中当前项目目录,如果没有更改过的话,认在C:\Windows\System32\config\systemprofile\AppData\Local\Jenkins\.jenkins\workspace\项目名称

3.5 验证自动构建

  • 开始构建
    经过以上的配置,就已经配置好了一个jenkins项目了,返回到首页,就会有一个项目,点击构建按钮,就可以自动构建了

    在这里插入图片描述

  • 构建历史
    点击项目名称,就可以进入到项目详情页,然后左下角会有构建历史,点击构建历史,就可以查看每次构建的控制台输出情况:

    在这里插入图片描述


    控制台输出的信息:

    在这里插入图片描述

这样一个最基本的vue项目的持续构建就完成啦,不需要再手动构建项目,手动上传到服务器。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐