使用Jenkins自动部署vuejs项目

Jenkins&Git安装

需要安装jenkins和git（自行百度查看如何安装jenkins和git），vue项目的打包工具使用Jenkins自带的nodejs。

安装Jenkins插件

登录jenkins提供的可视化界面：

选择安装插件如下：(根据需求安装)

• NodeJS

Jenkins配置

进入到Jenkins Global Configuration界面，配置使用的环境：

Git配置：(配置在服务器上安装的位置)

NodeJS配置：
设定安装的NodeJS的名称，版本，勾选出自动安装。

自动部署配置

新建Item

新建自由风格的项目：

配置源代码

配置远程仓库地址以及登陆远程仓库的凭证：

构建触发器

设定在何种情况下设定构建，定时或者设定对应仓库的hook：

设定构建环境

设定NodeJS的安装地址，我们使用的是，Jenkins自带的NodeJS，版本:10.9.0：

构建命令

分步进行构建，具体构建命令如下：

1. node -v 显示出当前nodejs的版本
2. node install -g yarn 安装yarn（yarn比npm好用）
3. npm config set registry https://registry.npm.taobao.org --global
   npm config set disturl https://npm.taobao.org/dist --global 设定npm
4. yarn config set registry https://registry.npm.taobao.org --global
   yarn config set disturl https://npm.taobao.org/dist --global 设定yarn
5. yarn -v 查看yarn的版本
6. yarn install --pure-lockfile 安装相关依赖
7. yarn run build 打包
   
   
   

部署

打包后的位置：Jenkins安装目录\workspace\项目名\dist

使用nginx部署vue项目，修改nginx.conf：

    server {
        listen       8089;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
        	// 默认打包的位置：
            root   D:\\CI\\xx\\xxx\\dist;
            index  index.html index.htm;
        }
  }