【Vue】——Jenkins自动打包部署VUE项目

思路：
1、利用Jenkins自动打包并压缩
2、将打包好的压缩文件利用SSH发送到远程服务器
个人理解，Jenkins其实是把我们平时打包部署项目的操作弄成一个流程，所以按照我们平时打包部署项目的流程去思考，然后找到对应在Jenkins中如何配置就可以实现基础的打包上传部署。

1 Jenkins安装

2 SSH安装

详细的内容可以去网上搜搜，不赘述。主要想记录一下安装方式，推荐第三种。
ssh安装有三种方式：
【1】用Windows PowerShell

执行

Add-WindowsCapability-Online -Name OpenSSH.Server~~~~0.0.1.0

Add-WindowsCapability-Online -Name OpenSSH.Client~~~~0.0.1.0

但我没有安装成功，一直卡住。。。
【2】用Windows可选功能添加。


但我还是失败了。。。
【3】直接下载安装包（推荐！！！！）
SSH安装包下载地址
下载好点击安装就可以了。

3 Jenkins配置

3.1 安装node插件

因为是vue项目，所以需要配置node环境。
Manage Jenkins→Plugins。

我这里已经安装过了，第一次安装就在【Available plugins】里面搜索NodeJS Plugin安装就可以了。



安装需要的node版本即可。点击版本可以选择对应的版本，别名自定义。

3.2 SSH配置

在设置里面添加SSH配置。
注意：

Remote Directory

是待会儿SSH默认发送到的文件夹目录，不是SSH发布后执行命令行的初始目录。

点击高级，展开如下页面，勾选 Use password authentication, or use a different key，然后输入对应的密码。然后保存。

3.3 执行命令可能出现乱码

在设置里面新增环境变量。


新增，键：LANG，值：zh.CH.UTF-8

修改Jenkins安装目录下的jenkins.xml文件里面对应位置新增 -Dfile.encoding=utf-8。

4 新建项目

4.1 初始化项目

4.2 配置项目——确定项目从何而来

这里配置的是git项目。
打开git项目，我是直接把这个路由复制过去的。（这个页面是git里面，克隆代码里）

粘贴到这个里面。

4.3 配置node环境

执行了【3.1 安装node插件】之后才会有node可选项。

4.4 添加构建步骤

可以看到，首先执行的是安装项目包并打包，可以根据自己项目需要进行设置。
设想你刚拉下项目到打包的时候需要干嘛，就把这些命令行写进这里面。

npm install --registry=https://registry.npmmirror.com
npm run build

下一步执行的命令就是是进入到打包文件夹dist将build后的文件压缩到main-app.tar.gz（后缀相同，前面名称自定义，和后面对应就行） 文件里面。以便后续使用。

cd dist
#rm -rf main-app.tar.gz
tar -zcvf main-app.tar.gz *

经过以上步骤，我们保存之后，回到外层操作界面，点击Build Now。

现在已经可以在C:\Users\Administrator\AppData\Local\Jenkins.jenkins\workspace （这是Jenkins默认的工作文件夹，如果没设置的话就是这里，根据需要可以修改）下找到我们的Jenkins项目，点击进入项目可以看到我们的项目代码，以及打包并压缩好的文件。

4.4 配置SSH

上面我们已经得到了自己想要的文件，下面就是想办法把打包好的文件发送到服务器，并且解压放到对应的文件目录就可以了。
这里就是用SSH来把压缩文件发送到服务器，并解压到对应文件夹。


注意： 这里有个我找了好久的点（虽然现在也没完全解决）。
【Exscute command】里面的内容是在文件发送过去之后就执行的命令。
我这里写的是：

tar -xf "testPublish\main-app.tar.gz"-C "testPublish"

这句话的意思是解压testPublish\main-app.tar.gz并移动到testPublish文件夹下。
之前在【3.2 SSH配置 】设置里面设置的

Remote Directory

是testPublish，所以在这里不设置Remove directory的情况下，压缩好的文件main-app.tar.gz就会放在testPublish下，并解压到testPublish文件夹里面。

但是！！最开始我是这么写的

cd testPublish
tar -xf "main-app.tar.gz"

这样就一直解压不成功，但是这个在cmd命令行里面是可以执行的。
最后发现好像只执行了第一句，所以就合成一句了。但是不应该啊。。。我想不通。
因为是还需要有其他操作的，比如重启nginx这类的，那怎么整。。。
现在我能想到的是，把其他的操作设置成一个.bat脚本文件，然后用一行命令去执行这个.bat文件，被烦到了！
另外，如果不知道一开始执行Exscute command命令是在哪个文件目录下的话，可以把这里改成cd，点击【高级】勾选Verbose output in console，这样查看构建历史的时候，在控制台输出里面看到文件发送成功后执行命令的输出了。



滑到下面就可以看到执行命令的路径了。