Arn0's Blog

Live your life with passion.
With 三倍Ice Cream !!!

  1. 1. 给伸手党的Jenkinsfile
    1. 1.1. Jenkinsfile
  2. 2. 0x00 热身准备
    1. 2.1. 在本地搭建Hexo
    2. 2.2. 编辑Hexo根目录配置文件
    3. 2.3. 装deployer插件
  3. 3. 0x01 设置代码仓库
    1. 3.1. 新建项目
    2. 3.2. 提交本地仓库
  4. 4. 0x02 配置持续集成
    1. 4.1. 初始化
    2. 4.2. 设置流程配置
    3. 4.3. 设置访问令牌
    4. 4.4. 设置变量
  5. 5. 0x03 设置域名绑定
    1. 5.1. 绑定域名到Coding
    2. 5.2. 设置Cname
  6. 6. 搞定

这篇文章要是发了出来,那我就写教程。——写于2019年12月26日 PM3:00

好的,为了履行对自己的承诺,今天就水一篇文章来教大伙用腾讯云CI自动构建Hexo。

给伸手党的Jenkinsfile

PS: 用之前别忘了设置访问令牌,只需要勾选project:depot就行。如图
设置访问令牌

Jenkinsfile

pipeline {
  agent any
  stages {
    stage('检出') {
      steps {
        checkout([$class: 'GitSCM', branches: [[name: env.GIT_BUILD_REF]], 
                                                                                                                  userRemoteConfigs: [[url: env.GIT_REPO_URL, credentialsId: env.CREDENTIALS_ID]]])
      }
    }
    stage('构建') {
      steps {
        sh '''npm install -g hexo-cli
npm install
echo "构建完成."'''
      }
    }
    stage('测试') {
      steps {
        sh '''echo "单元测试中..."
hexo clean
hexo g 
echo "单元测试完成."'''
      }
    }
    stage('部署') {
      steps {
        sh '''echo "部署中..."
npm install hexo-deployer-git --save
sed -i "s/Hexo_Passwd/${Hexo_Passwd}/g" _config.yml || exit 1 //使用变量里的密码
sed -i "s/Hexo_UserName/${Hexo_UserName}/g" _config.yml || exit 1 //使用变量里的用户名
npm install hexo-deployer-git --save
hexo d
echo "部署完成"'''
      }
    }
  }
}

在左侧菜单栏进入”构建与部署-构建”找到页面上的”变量与缓存”选项设置成刚刚生成令牌的用户名和密码,其中将Hexo_UserName设置成用户名,Hexo_Passwd设置成密码。
创建环境变量

伸手党看到这里就可以Ctrl+W了。

0x00 热身准备

这里假设你已经有一个可以使用的域名,并且Coding个人账户已经注册完成。虽然在这里将申请域名的步骤都写上有助于提高我博客的SEO,但这对我键盘寿命不利QWQ。

在本地搭建Hexo

npm install hexo-cli -g
hexo init blog
cd blog
npm install
hexo server

编辑Hexo根目录配置文件

编辑_config.yml文件

在文件末端加上这几行

deploy:
  type: git
  repo: https://Hexo_UserName:Hexo_Passwd@仓库地址
  branch: gh-pages

“仓库地址”那记得填你自己的。

注意,repo里面的Hexo_UserNameHexo_Passwd不要动,Jenkinsfile里面会用到。

装deployer插件

npm install hexo-deployer-git --save

0x01 设置代码仓库

新建项目

在工作台页面上点击“全部项目”,点下项目右边的加号,新建一个项目。

必填的都填上,记得要初始化一下仓库。

初始化仓库

新建之后,在新的页面右上角那里看到仓库地址了吗?复制下来,待会有用。

提交本地仓库

在Hexo的根目录,输几条命令

git remote set-url 贴上刚刚复制下来的仓库地址 #与远程仓库关♂联
git add * #增加除.gitignore里面的文件
git commit -m "init blog" #本地提交
git push origin master #提交远程仓库
git branch -b gh-pages #在本地创建一条分支,今后专门用来放Hexo生成的页面。
git push origin gh-pages #再将这条分支提交远程仓库
git checkout master

0x02 配置持续集成

初始化

在左侧菜单栏进入”构建与部署-构建”,点击“新建构建计划配置”
计划名称随便写一个就行。

记得在“配置来源”里面勾选“使用静态配置的 Jenkinsfile”

设置流程配置

一开始页面上的是“图形化编辑器”,我们现在不需要这个。点击“文本编辑器”。然后将下面的Jenkinsfile复制上去。

pipeline {
  agent any
  stages {
    stage('检出') {
      steps {
        checkout([$class: 'GitSCM', branches: [[name: env.GIT_BUILD_REF]], 
                                                                                                                  userRemoteConfigs: [[url: env.GIT_REPO_URL, credentialsId: env.CREDENTIALS_ID]]])
      }
    }
    stage('构建') {
      steps {
        sh '''npm install -g hexo-cli
npm install
echo "构建完成."'''
      }
    }
    stage('测试') {
      steps {
        sh '''echo "单元测试中..."
hexo clean
hexo g 
echo "单元测试完成."'''
      }
    }
    stage('部署') {
      steps {
        sh '''echo "部署中..."
npm install hexo-deployer-git --save
sed -i "s/Hexo_Passwd/${Hexo_Passwd}/g" _config.yml || exit 1 //使用变量里的密码
sed -i "s/Hexo_UserName/${Hexo_UserName}/g" _config.yml || exit 1 //使用变量里的用户名
npm install hexo-deployer-git --save
hexo d
echo "部署完成"'''
      }
    }
  }
}

保存,然后我们设置下“访问令牌”。

设置访问令牌

只需要勾选project:depot就行。如图
设置访问令牌

设置变量

找到项目页面左侧栏“构建与部署-构建”页面上的”设置”按钮,
设置按钮

进入”变量与缓存”选项设置成刚刚生成令牌的用户名和密码,其中将Hexo_UserName设置成用户名,Hexo_Passwd设置成密码。
创建环境变量
别忘了按页面底部的保存按钮(我就犯过一次傻)。

然后找到页面顶部的面包屑导航栏,返回“持续构建”页面,点一下“立即构建”;或者将本地仓库推送到远程仓库

git push origin master

等那么一小会,到“构建”页面那里看下情况,不出意外估计就是下图的结果了。
Coding构建成功!

以后就直接推送master分支的内容,Coding那边就会帮你自动构建-部署-发布了。

0x03 设置域名绑定

绑定域名到Coding

在左侧栏找到“静态网站”,按页面右上角的“设置”,然后直接鼠标滚动到页面底部,你会见到这个界面。在“绑定新域名”的表格框里面填上你的域名,之后按“绑定”就好。

如果你想要HTTPS,顺手点一下下方的强制HTTPS滑动按钮。如无意外,静候15分钟SSL证书就好了。
设置域名绑定

设置Cname

在左侧栏找到“静态网站”,回到之前那个页面,将“访问地址”那个域名设置成CNAME的值就好了。如果你还是一头雾水,那就去看下官方文档吧。

搞定

洋洋洒洒说了那么多,都是凭着记忆来的,好像……有些东西点超纲了,又总觉得漏了点什么Σ(っ °Д °;)っ。为了避免被打,分享点小技巧吧。

Make快速提交代码到远程仓库

This article was last updated on days ago, and the information described in the article may have changed.