docusaurus 是facebook 开源的一款文档脚手架工具,可以快速的进行文档生成,基于markdown
同时已经内置了gh-pages 发布的命令,对于ci 工具,我们只需要简单的配置就可以了

环境准备

  • 创建github空项目
    很简单直接鼠标点击就可以了
  • 创建docusaurus demo站点
npx docusaurus-init
  • 修改名称
    docusaurus 有自己的项目布局要求,修改之后的如下
  • 配置修改
    因为使用gh-pages 存在一个资源加载路径的问题,docusaurus 很不错已经帮助我们提供了配置了,只需要修改就可以了
    如下:
./website/siteConfig.js

添加circleci 集成

  • 添加ci集成
    这个可以打开circleci 网站进行授权,或者通过github 市场添加
  • 配置circleci 构建文件
    circleci 有自己的构建路径说明

    mkdir .circleci
    touch config.yml
    内容如下:
    version: 2
    jobs:
    build:
    docker:
    - image: circleci/node:8.11.4
    filters: ## 分支过滤,很重要,不然gh-pages 会报错, branches:
    only:
    - master
    steps:
    - checkout
    - run:
    name: Deploying to GitHub Pages
    command: |
    git config --global user.email "1141591465@qq.com" ## git 的一些配置
    git config --global user.name "rongfengliang"
    echo "machine github.com login rongfengliang password $GITHUB_TOKEN" > ~/.netrc ## 基于github token 的登录
    cd website && yarn install && GIT_USER=rongfengliang yarn run publish-gh-pages ## npm script 执行

    说明:
    GIT_USER 用户比较重要,同时注意权限的设置,需要具有write 的权限,GITHUB_TOKEN 是一个环境变量,可以在circleci 构建
    环境变量配置界面添加

构建&&查看效果

  • 添加circleci 构建
  • 构建
    修改代码,提交,就会触发构建
  • 效果
  • 构建好的gh-pages

  • 说明
    如果提示gh-pages 不存在,可以手工创建,并删除代码,提交就可以了

参考资料

https://github.com/graphql-faas/continuous-api-management
https://docusaurus.io/docs/en/publishing
https://circleci.com/docs/

 
 
 
 

docusaurus 生成的website 通过circleci部署gh-pages的更多相关文章

  1. vs自己主动生成的WebService配置文件在部署到IIs6后,服务调用失败的解决方法

    近日.在项目中须要引用java公布的WebService,加入服务引用后,调用一切正常. 配置例如以下: <system.serviceModel> <bindings> &l ...

  2. Linux(Centos)部署Jenkins,并配置Git生成Jar包进行发布部署

    需要先安装jdk.maven.git环境 jdk安装:https://www.cnblogs.com/pxblog/p/10512886.html maven安装:https://www.cnblog ...

  3. Windows使用Node.js自动生成Vue.js模版环境部署步骤-----记录

    node.js官网下载并安装node 进入node文档目录下,运行cmd 输入 node -v 查看node版本 出现表示安装完成 输入 npm -v 显示npm版本信息 安装cnpm 输入 npm ...

  4. SharePoint2007 开发部署Application Pages

    介绍:SharePoint应用程序页,也就是_layouts路径下的aspx页面,服务器C:\Program Files\Common Files\Microsoft Shared\web serve ...

  5. 使用 circleci 自动部署 vuepress 到 github

    概述 今天我想把博客什么的搬到 github 的 vuepress 上面.但是每次提交 md 文件需要手动打包然后再提交到 github 的 gh-pages,非常麻烦.所以我去研究了一下用 circ ...

  6. ASP.NET生成WORD文档,服务器部署注意事项

    网上转的,留查备用,我服务器装的office2007所以修改的是Microsoft Office word97 - 2003 文档这一个. ASP.NET生成WORD文档服务器部署注意事项 1.Asp ...

  7. [ExtJS5学习笔记]第三十一节 sencha extjs 5使用cmd生成的工程部署到tomcat服务器

    本文地址:http://blog.csdn.net/sushengmiyan/article/details/42940883 本文作者:sushengmiyan ------------------ ...

  8. Jenkins持续部署-自动生成版本号

    目录 Jenkins持续部署-自动生成版本号 目录 前言 目的 详细流程 获取SVN Reversion 获取需求号 设置编译前读取版本号 总结 参考文献 Jenkins持续部署-自动生成版本号 目录 ...

  9. Django学习之天气调查实例(3):部署静态文件CSS、JS、images等(部署环境基于Ubuntu)

    在设计登录界面时,采用了网上下载的登录模板,漂亮,简易.但是在测试和部署时,发现原来模板中采用的js文件和css文件,却着实让我折腾了好几天. 在以往的网页设计中,一般只要把测试站点开启后,网页中的静 ...

随机推荐

  1. SQL-31 获取select * from employees对应的执行计划

    题目描述 获取select * from employees对应的执行计划 explain select * from employees explain  用于获得表的所有细节

  2. 强化学习7-Sarsa

    之前讲到时序差分是目前主流强化学习的基本思路,这节就学习一下主流算法之一 Sarsa模型. Sarsa 是免模型的控制算法,是通过更新状态动作价值函数来得到最优策略的方法. 更新方法 Q(S,A)=Q ...

  3. C++中数组定义及初始化

    一.一维数组 静态 int array[100]; 定义了数组array,并未对数组进行初始化 静态 int array[100] = {1,2}: 定义并初始化了数组array 动态 int* ar ...

  4. 七、在U-boot中让LCD显示图片

    1. 增加Nandflash读取代码 因为要显示图片,而图片明显是放在Nandflash中比较合适,因此需要有能够操作Nandflash的函数.在U-boot中已经有能操作Nandflash的函数了, ...

  5. arduino使用oled显示时间MQ_2温湿度

    这代码一般都是复制过来,在小改下就行了 代码如下: double Fahrenheit(double celsius) { ; } //摄氏温度度转化为华氏温度 double Kelvin(doubl ...

  6. 框架:MVC

    MVC 一.介绍 MVC是模型-视图-控制器的缩写,一种软件思想,强制性的把应用程序的输入.处理和输出分开.可以和任何的重定向能解耦. 三部分的任务说明: 视图:获取数据,显示数据 模型:处理数据 控 ...

  7. 初识linux------用户和用户组

    事先说明 本Linux的版本为Ubuntu. 为避免一些初学者由于权限问题特此事先说明,在非root权限下时,所有的代码加sudo:如下 (1)不在root权限 sudo useradd -m 用户名 ...

  8. 多进程于多线程的区别,cpu密集型适合用什么

    多线程:在单个程序中同事运行多少个线程完成不同的工作,成为线程. 线程共享内存空间,进程的内存是独立的, 同一个进程的线程间可以直接交流: 两个进程想通信,必须通过一个中间代理来实现, 一个线程可以控 ...

  9. python 递归函数操作方法

    .递归 是指函数/过程/子程序在运行过程序中直接或间接调用自身而产生的重入现象.在计算机编程里,递归指的是一个过程:函数不断引用自身,直到引用的对象已知.使用递归解决问题,思路清晰,代码少.但是在主流 ...

  10. js - 如何使子元素阻止继承父元素事件

    想要阻止点击 #content 区域时触发a事件,需要在 #content 区域内加入阻止事件冒泡的代码,具体代码如下: <div id="box" onclick=&quo ...