使用gitbook编译md文件为html并使用jenkins发布到nginx【多方式详细步骤】；

已于 2022-06-18 23:11:49 修改
阅读量1.3k 收藏 4
点赞数 2
分类专栏： Jenkins 文章标签： jenkins nginx html
于 2022-06-18 22:39:31 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_44930876/article/details/125350702
版权

文章目录

需求

因公司服务需要重构，架构也提出了一套自己用markdown写的的开发指南，里面包括一些框架以及各种流程图和一些代码的开发规范，也有一些常用网站供开发者们写代码时进行参考；现在需要运维来将这些markdown文件转换为html文件并使用nginx（web）展示出来；

发布方式分为：

  • 手动发布：手动发布就是让大家熟悉下整个流程
  • 自动发布：使用jenkins根据手动发布的流程实现自动发布的效果；

一、手动将markdown文件用gitbook编译为html发布到nginx

1.安装node

因为使用gitbook进行编译需要依赖于node环境，所以先安装node；

[root@k8s-master ~]# tar -zxf node-v15.14.0-linux-x64.tar.gz 
[root@k8s-master ~]# mv node-v15.14.0-linux-x64 /usr/local/node-v15.14.0
[root@k8s-master local]# vim /etc/profile #设置环境变量
##node-v15.14.0##
export NODE_HOME=/usr/local/node-v15.14.0
export PATH=$NODE_HOME/bin:$PATH
[root@k8s-master ~]# source /etc/profile
[root@k8s-master ~]# node -v 
v15.14.0
[root@k8s-master ~]# npm -v 
7.7.6


2.使用npm安装gitbook

安装gitbook-cli

[root@k8s-master ~]# npm install gitbook-cli -g
...
npm notice 
npm notice New major version of npm available! 7.7.6 -> 8.12.2
npm notice Changelog: https://github.com/npm/cli/releases/tag/v8.12.2
npm notice Run npm install -g npm@8.12.2 to update!
npm notice

在安装完gitbook-cli之后需要执行gitbook -V命令安装gitbook库（gitbook-cli 构建需要依赖gitbook 库）并验证是否安装成功
提示：其实这里不一定要执行gitbook -V命令，后面第4步构建的时候执行gitbook build命令也行；

[root@k8s-master ~]# gitbook -V
CLI version: 2.3.2
Installing GitBook 3.2.3
/usr/local/node-v15.14.0/lib/node_modules/gitbook-cli/node_modules/npm/node_modules/graceful-fs/polyfills.js:287
      if (cb) cb.apply(this, arguments)
                 ^

TypeError: cb.apply is not a function
    at /usr/local/node-v15.14.0/lib/node_modules/gitbook-cli/node_modules/npm/node_modules/graceful-fs/polyfills.js:287:18
    at FSReqCallback.oncomplete (node:fs:194:5)

可用看到在执行gitbook命令的时候报错了，根据报错信息我们可用看到没有找到function这个函数，这个是因为版本问题，我们把有关使用这个函数的代码去掉就可以了；

[root@k8s-master ~]# vim /usr/local/node-v15.14.0/lib/node_modules/gitbook-cli/node_modules/npm/node_modules/graceful-fs/polyfills.js
  //fs.stat = statFix(fs.stat)  #这三行代码大约在62行，给他注释掉就可以了
  //fs.fstat = statFix(fs.fstat)
  //fs.lstat = statFix(fs.lstat)

然后再次gitbook -V查看；

[root@k8s-master ~]# gitbook -V
CLI version: 2.3.2
Installing GitBook 3.2.3
gitbook@3.2.3 ../../tmp/tmp-18981Z4Mwyfs1QNRu/node_modules/gitbook
├── escape-string-regexp@1.0.5
├── escape-html@1.0.3
├── destroy@1.0.4
├── ignore@3.1.2
├── bash-color@0.0.4
├── gitbook-plugin-livereload@0.0.1
...
└── npm@3.9.2
GitBook version: 3.2.3

安装gitbook完成；



3.拉取所需要编译的markdown文件到本地

[root@k8s-master ~]# git clone https://gitee.com/xxxx.git 
Cloning into 'xxxx'...
Username for 'https://gitee.com': xxxx
Password for 'https://fandaoshuai@gitee.com': 
remote: Enumerating objects: 341, done.
remote: Counting objects: 100% (341/341), done.
remote: Compressing objects: 100% (330/330), done.
remote: Total 341 (delta 193), reused 0 (delta 0), pack-reused 0
Receiving objects: 100% (341/341), 464.85 KiB | 349.00 KiB/s, done.
Resolving deltas: 100% (193/193), done.
[root@k8s-master ~]# ll dev-doc/
total 8
drwxr-xr-x 2 root root   41 Jun 18 19:50 attachment
drwxr-xr-x 2 root root   38 Jun 18 19:50 components
drwxr-xr-x 2 root root   20 Jun 18 19:50 faq
drwxr-xr-x 2 root root  100 Jun 18 19:50 images
drwxr-xr-x 2 root root  101 Jun 18 19:50 introduction
drwxr-xr-x 3 root root  222 Jun 18 19:50 project
-rw-r--r-- 1 root root  185 Jun 18 19:50 README.md
drwxr-xr-x 2 root root  302 Jun 18 19:50 scaffold
-rw-r--r-- 1 root root 2213 Jun 18 19:50 SUMMARY.md

提示：这个SUMMARY.md文件是很重要的，他类似于目录，gitbook编译的时候需要有这个文件

[root@k8s-master ~]# ll dev-doc/introduction/
total 20
-rw-r--r-- 1 root root   81 Jun 18 19:50 arch.md
-rw-r--r-- 1 root root 2198 Jun 18 19:50 framework.md
-rw-r--r-- 1 root root  124 Jun 18 19:50 oauthflow.md
-rw-r--r-- 1 root root   69 Jun 18 19:50 简介.md
-rw-r--r-- 1 root root 1918 Jun 18 19:50 网站地址.md


4.进入项目代码目录下编译markdown文件为html文件

[root@k8s-master ~]# cd dev-doc/
[root@k8s-master dev-doc]# gitbook build
info: 7 plugins are installed 
info: 6 explicitly listed 
info: loading plugin "highlight"... OK 
info: loading plugin "search"... OK 
info: loading plugin "lunr"... OK 
info: loading plugin "sharing"... OK 
info: loading plugin "fontsettings"... OK 
info: loading plugin "theme-default"... OK 
info: found 27 pages 
info: found 14 asset files 
info: >> generation finished with success in 1.8s !

编译完成后会生成一个_book的目录，里面就是编译好了的html文件；

[root@k8s-master dev-doc]# ll 
total 16
drwxr-xr-x  2 root root   41 Jun 18 19:50 attachment
drwxr-xr-x 10 root root  239 Jun 18 20:22 _book
drwxr-xr-x  2 root root   38 Jun 18 19:50 components
drwxr-xr-x  2 root root   20 Jun 18 19:50 faq
drwxr-xr-x  2 root root  100 Jun 18 19:50 images
drwxr-xr-x  2 root root  101 Jun 18 19:50 introduction
drwxr-xr-x  3 root root   51 Jun 18 20:10 node_modules
-rw-r--r--  1 root root   57 Jun 18 20:10 package.json
-rw-r--r--  1 root root  721 Jun 18 20:10 package-lock.json
drwxr-xr-x  3 root root  222 Jun 18 19:50 project
-rw-r--r--  1 root root  185 Jun 18 19:50 README.md
drwxr-xr-x  2 root root  302 Jun 18 19:50 scaffold
-rw-r--r--  1 root root 2213 Jun 18 19:50 SUMMARY.md
[root@k8s-master dev-doc]# cd _book/introduction/
[root@k8s-master introduction]# ll 
total 92
-rw-r--r-- 1 root root 19891 Jun 18 20:22 arch.html
-rw-r--r-- 1 root root 24235 Jun 18 20:22 framework.html
-rw-r--r-- 1 root root 20440 Jun 18 20:22 oauthflow.html
-rw-r--r-- 1 root root    69 Jun 18 20:22 简介.md
-rw-r--r-- 1 root root 22509 Jun 18 20:22 网站地址.html##可用对比第三步这里以及变成了html
[root@k8s-master introduction]# pwd 
/root/dev-doc/_book/introduction


5.将编译好的_book目录发布到nginx

提示：这里拿安装好的nginx做个简单的示例，只需要把编译好的_book目录放到nginx的网站目录下就行；

[root@k8s-master ~]# cp -pr /root/dev-doc/_book /usr/share/nginx/html/_book 
[root@k8s-master ~]# cd /etc/nginx/conf.d/
[root@k8s-master conf.d]# vim dev-doc.conf
server {
        listen  80;
        server_name www.my-dev-doc.com;
        root   /usr/share/nginx/html/_book;
        index  index.html index.htm;
        }
[root@k8s-master conf.d]# nginx -t 
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful
[root@k8s-master conf.d]# nginx -s reload

去浏览器访问下ww.my-dev-doc.com看下效果；
在这里插入图片描述
发布完成；

以上就是通过手动发布的过程；




二、结合jenkins实现自动将markdown文件使用gitbook编译为html文件并发布到nginx

1.前期准备：

 ①结合jenkins发布的话，我们需要在jenkins的主机上安装npm以及gitbook，也就是手动发布里的第1，2步骤，这里我就省略了，大家可以参考手动发布里的步骤在jenkins主机安装；

 ②安装Publish Over SSH插件并配置，用于发布文件到远程主机；
在这里插入图片描述
在jenkins配置管理处(Manage Jenkins–>System Configuration–>Configure System)配置Publish over SSH（添加远程nginx主机）

在这里插入图片描述

在这里插入图片描述
提示：在高级里面要设置远程主机的密码，然后可以先点击Test Configuration测试连接；

Remote Directory：远程主机的发布目录，也就是你jenkins将编译好的包放到远程主机的哪个目录下（建议填写发布目录），我这里写的是nginx的网站根目录，一会儿我们要把编译好的_book文件放到这个目录下面；



2.新建一个流水线项目并进行配置；

在这里插入图片描述

这里我已经建过这个名称的项目了，所以他会提示已存在；

配置流水线
在这里插入图片描述

pipeline {
        agent any
        //全局变量
        environment { 
            //gitee代码仓库地址;
         Gitee_Registry_URL= 'https://gitee.com/xxxx.git'

         
        }
    parameters {
      gitParameter branch: '', branchFilter: '.*', defaultValue: 'master', description: '选择拉取代码的分支', name: 'Branch', quickFilterEnabled: false, selectedValue: 'NONE', sortMode: 'NONE', tagFilter: '*', type: 'GitParameterDefinition'
    }

    stages {
        stage('拉取代码') {
            steps {
                checkout([$class: 'GitSCM', branches: [[name: "${params.Branch}"]], extensions: [], userRemoteConfigs: [[credentialsId: 'pull-code_gitee_fandaoshuai', url: "${Gitee_Registry_URL}"]]])
            }
        }
        
        stage('代码编译') {
            steps {
                sh """
                cd $JENKINS_HOME/workspace/$JOB_NAME/
                source /etc/profile
                //这里我们进入jenkins当前项目工作空间下进行编译
                gitbook build 
                """
                }
            }
        
        stage('部署') {
            steps {
                sshPublisher(publishers: [sshPublisherDesc(configName: 'web-nginx', transfers: [sshTransfer(cleanRemote: false, excludes: '', execCommand: '''source /etc/profile
                nginx -s reload ''', execTimeout: 120000, flatten: false, makeEmptyDirs: false, noDefaultExcludes: false, patternSeparator: '[, ]+', remoteDirectory: '_book/', remoteDirectorySDF: false, removePrefix: '_book/', sourceFiles: '_book/**/*')], usePromotionTimestamp: false, useWorkspaceInPromotion: false, verbose: false)])
            }
        }
   }
}

提示："拉取代码" 和“部署”处的流水线语句大家可以在片段生成器里生成，然后粘贴到steps里就可以；

在这里插入图片描述

在这里插入图片描述
然后点击下面的生成流水线脚本粘贴到steps里即可；


然后保存并退出，开始构建
在这里插入图片描述

构建结果；
在这里插入图片描述
在这里插入图片描述

浏览器访问测试：
在这里插入图片描述





最后再给大家看下不用流水线的配置过程：

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
Send build artifacts over SSH这个模块参数不熟悉的话可参考：jenkins的Send build artifacts over SSh参数详解；


然后应用保存退出后开始构建；效果是和流水线一样的；

总结

例如：以上就是今天要记录的内容，使用gitbook编译markdown文件为html并发布到nginx;

不知名运维:
关注
  • 2
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
如何使用jenkins实现发布部分更新文件
08-18
主要介绍了如何使用jenkins实现发布部分更新文件,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
基于jenkins发布编译后的class文件
08-18
主要介绍了基于jenkins发布编译后的class文件,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
jenkins学习笔记markdown格式
04-17
本人运维工程师，因工作需要，编写了一个jenkins的技术文档，markdown格式可以使用typora工具进行编辑，主要是介绍的了初时jenkins服务，jenkins的部署，和jenkins管理gitlab代码仓库，和实现为开发人员自动构建上传代码
Jenkins 编译后使用SSH发布详解
08-25
主要介绍了Jenkins 编译后使用SSH发布详解,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
使用Jenkins+Ansible实现自动化部署Nginx
02-24
本文介绍如何使用Jenkins+Ansible实现对Nginx的自动化部署。最终达到的效果有如下几点：只要你将Nginx的配置推送到GitHub中，Jenkins就会自动执行部署，然后目标服务器的Nginx配置自动生效。这个过程是幂等（idempotent）的，只要代码不变，执行多少遍，最终效果不变。如果目标机器没有安装Nginx，则会自动安装Nginx。自动设置服务器防火墙规则。本次实验使用DockerCompose搭建Jenkins及Jenkinsagent。使用Vagrant启动一台虚拟机，用于部署Nginx。使用Vagrant是可选的，读者可以使用VirtualBox启动一个虚拟机。使
在github仓库配置gitbook生成的html页面
最新发布
Chen_5864的博客
07-26 302
在github仓库配置gitbook生成的html页面
基于gitbook、nginx实现静态网站部署
Junetest的博客
05-29 1615
基于gitbook、nginx实现静态网站部署 场景：对markdown格式的文件进行静态页面的呈现，同时利用nginx实现静态网站的部署 一、gitbook部分 1、下载好gitbook，可参考：https://blog.csdn.net/Junetest/article/details/106014594 2、进入需要转换为电子书的文件夹，执行初始化 gitbook init 3、构建电子书 gitbook install #安装插件 gitbook build 4、构建完之后，当前目录下会增加一个
gitbook将md文档生成html页面
Chen_5864的博客
07-26 825
使用gitbook将md文档组合成页面形式
gitbook制作html目录,目录创建与打包
weixin_29123181的博客
06-10 673
目录创建与打包一、快速创建APICloud或Html5项目模板1、使用快捷键Ctrl+Shift+P/Fn+F1打开如下界面2、在搜索框里面输入minxing，出现一列敏行的插件，选择第一项：新增项目模板3、选择新增项目模板后页面变化如下：4、在新选项中选择html5模板，点击后会出现一些预置模板5、选择九宫格grid选项，点击后会自动出现弹框让你选择项目保存位置以及文件名称，本例将文件保存在了桌...
gitbook介绍，使用，打包
longlong6682的博客
03-28 1382
目录： gitbook介绍 设置目录层级结构 gitbook一些实用插件 把gitbook打包 一. gitbook介绍 1、gitbook说明 GitBook 使用的markdown语法 在此基础上做了一些 写作便利性的加强 Markdown 是一种轻量级的「标记语言」，优点在于 专注你的文字内容而不是排版样式。 轻松的导出 HTML、PDF 和本身的 .md 文件。 纯文本内容，兼容...
使用Jenkins部署React项目的方法步骤
01-21
背景 公司的前端项目部署方式比较简单，整个过程基本上是手动的；...搭建 Jenkins 有很多方案，这里选择使用 docker 搭建。 docker-compose.yml 的内容如下： version: '3' services: fejenkins: user: root image
如何使用Jenkins编译并打包SpringCloud微服务目录
08-25
主要介绍了如何使用Jenkins编译并打包SpringCloud微服务目录,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
Jenkins使用sonarqube代码扫描并发送扫描报告邮件
01-08
jenkins中使用例子: #定义sonar项目名称 sonar_url=bus-pub #邮件接收人 [email protected] [email protected] send3= #重新下载对应项目扫描报告 rm -f ${JOB_NAME}.pdf wget ...
详解使用Jenkins自动编译部署web应用
08-27
本篇主要介绍基于Jenkins实现持续集成的方式，通过案例介绍线上自动编译及部署的配置过程，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
docker-jenkins-nginx:在 nginx 服务器后面为 Jenkins 构建 Docker
06-12
用于在 nginx 后面运行 jenkins 服务器的 Docker 构建（使用 google oAuth 作为身份验证）docker-in-docker 可用，因此 Jenkins 可以启动 dockerized 构建 容器设置 导师 docker 容器将在启动时运行 supervisor ...
使用Jenkins对接Github进行自动化CI
02-24
Jenkins在Dockerhub上有官方镜像和社区镜像,根据官方描述，Jenkins的镜像已经由社区接管维护，镜像为jenkinsci/jenkins,所以这次的集成就用这个社区版的Jenkins。因为我的docker已经进行了swarm集群处理,所以可以用...
Jenkins使用及插件开发介绍
02-25
Jenkins使用及插件开发介绍介绍Jenkins是一个广泛用于[持续构建]()的可视化web工具，就是各种项目的的“自动化”编译、打包、分发部署，将以前编译、打包、上传、部署到Tomcat中的过程交由Jenkins，Jenkins通过给定...
使用Jenkins配置自动化构建
02-26
持续集成是个简单重复劳动，人来操作费时费力，使用自动化构建工具完成是最好不过的了。为了实现这个要求，我选择了Jenkins。从http://mirrors.jenkins-ci.org/windows/latest下载windows下的最新安装版jenkins。...
jenkins实现安卓自动构建及nginx+qrencode生成二维码.txt
05-28
本方案主要是结合Jenkins+nginx+qrencode实现安卓源码自动构建的方法， 完美解决第三方平台蒲公英免费版限制生成的二维码限制10次下载的限制，而且资源保存在自己的服务器上也是最安全的，分享nginx+jenkins shell...
使用jenkins和docker进行centos部署springboot项目的详细步骤和详细命令
06-02
好的，以下是使用 Jenkins 和 Docker 进行 CentOS 部署 Spring Boot 项目的详细步骤和命令： 1. 在 CentOS 中安装 Docker 和 Docker Compose ```bash # 安装 Docker sudo yum update sudo yum install docker # 安装 Docker Compose sudo curl -L "https://github.com/docker/compose/releases/download/1.29.2/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose sudo chmod +x /usr/local/bin/docker-compose ``` 2. 在 CentOS 中拉取 Docker 镜像 ```bash # 从 Docker 仓库中拉取镜像 sudo docker pull your-docker-registry/image-name:tag ``` 3. 在 CentOS 中运行 Spring Boot 镜像 ```bash # 运行 Spring Boot 镜像 sudo docker run -d -p 8080:8080 your-docker-registry/image-name:tag # 如果你的 Spring Boot 应用需要使用数据库，你需要为其配置一个数据库服务。你可以使用 Docker Compose 来管理容器编排。 # 在服务器上创建一个文件夹来存储 Docker Compose 配置文件 mkdir ~/docker-compose # 在该文件夹中创建一个 docker-compose.yml 文件 nano ~/docker-compose/docker-compose.yml # 编辑该文件并添加以下内容： version: "3" services: app: image: your-docker-registry/image-name:tag ports: - "8080:8080" db: image: postgres environment: POSTGRES_USER: your-db-user POSTGRES_PASSWORD: your-db-password POSTGRES_DB: your-db-name # 启动 Docker Compose cd ~/docker-compose sudo docker-compose up -d # 如果你需要停止 Docker Compose sudo docker-compose down ``` 4. 在 Jenkins 中配置 Maven 插件和 Docker 插件 - 在 Jenkins 中安装 Maven 插件和 Docker 插件。 - 在 Jenkins 中配置 Docker 插件，确保 Jenkins 可以与 Docker 交互。 5. 在 Jenkins 中创建一个新的构建项目 - 在 Jenkins 中创建一个新的 Maven 项目，并配置 Git 代码库以获取源代码。 - 在构建项目中配置 Maven 构建步骤，构建出可执行的 Spring Boot jar 包。 - 在构建项目中添加一个后置操作步骤，使用 Docker 插件进行 Docker 镜像的构建。你需要为 Docker 镜像指定一个名称和标签，并指定构建上下文。 - 在构建项目中添加另一个后置操作步骤，使用 Docker 插件将构建好的镜像推送到 Docker 仓库中。 6. 在目标服务器上使用 Docker 运行 Spring Boot 镜像 - 在目标服务器上拉取构建好的 Spring Boot 镜像。 - 在目标服务器上使用 Docker 运行 Spring Boot 镜像，你可以使用 Docker Compose 或 Docker Stack 进行容器编排和管理。 以上是使用 Jenkins 和 Docker 进行 CentOS 部署 Spring Boot 项目的详细步骤和命令，希望对你有所帮助。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

不知名运维:

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值