在工作、学习中,不可避免会要写一些文档;又或者想搭建个简单网站,记录和分享您的生活经验或知识;撰写这些文档中使用 markdown 是一个非常不错的选择,让我们更加聚焦在文档表达的内容上。实际上笔者的文档基本都是在 Sublime 中用 markdown 格式撰写的。

在 先前文章 《Markdown的那些事儿》 也有提到到,围绕 markdown 有着大量的开源软件、库做支持;这里分享下使用基于MIT许可证的开源软件 Hugo 来管理 Markdown 文档,能帮助基于 markdown 生成各种风格主题的静态页面。先不妨看下笔者一些markdown 文档效果:https://quincik.gitee.io/algorithms/docs/nine/array/

Hugo 常用来做什么?

Hugo是一款强大的用于生成静态网页的程序,擅长于将 Markdown 文档按需要转换成各类主题的静态网页;它由Go语言编写的,在处理速度上非常快;也有人对比过类似一些产品比如 Jekyll / Hugo / Hexo,其编译网页的速度是最快的。

使用Hugo的主要场景包括搭建公司、产品或个人网站,尤其是在结合云服务器的环境下。它的强大性不仅体现在速度上,也涵盖了灵活性和多样性。静态网页生成的成果可以轻松部署于GitHub Page、Gitee Page等平台,同时也能便捷地转换为各种主题形式,满足用户多样化的需求。

结合Hugo和Nginx的组合,可以迅速、高效地搭建公司站点或个人站点。这种方式不仅利用了Hugo快速生成静态网页的特性,还借助Nginx提供的高性能、稳定的Web服务器功能,为访问者提供了极佳的体验;最近,腾讯云服务器CVM推出了不少优惠活动,感兴趣的不妨试试。

搭建 Hugo 环境

第一步,安装 Go 语言环境,可以直接去官网下载下 GO 的程序,进行安装即可。附上官网安装链接:https://go.dev/doc/install

第二步,Hugo 经常会结合 Git 一起用,这里也安装 Git 的程序,同样也是推荐官方下载:https://git-scm.com/download/win

第三步,安装 Dart Sass, Hugo v0.114.0 以及 后续版本 是用Dart 来进行 Sass 的编译的;笔者是在 Windows 使用 Scoop 安装(其他系统可能更为方便),以下给出一些参考步骤:

  1. 先使用 win 自带的 PowerShell 来安装 Scoop # Optional: Needed to run a remote script the first time

    Set-ExecutionPolicy RemoteSigned -Scope CurrentUser

    irm get.scoop.sh | iex scoop install sass当然这只是一种选择,也可以考虑直接去 github 上下载 release 安装,这里给的是 v1.69.5:https://github.com/sass/dart-sass/releases/tag/1.69.5

  2. 使用 Scoop 安装 sass。

第四步,安装 Hugo ,去 Github 上下载个最新版本安装即可,这里给的是 v0.120.4 :https://github.com/gohugoio/hugo/releases/tag/v0.120.4

特别注意下以上的环境安装,记得都配置下 系统环境变量Path 方便后续的使用。最后附上,笔者安装的程序的 相关版本信息。

PS D:\> go version
go version go1.21.4 windows/amd64 PS D:\> git -v
git version 2.42.0.windows.2 PS D:\> sass --version
1.69.5 PS D:\> hugo version
hugo v0.120.4 ...

Hugo 快速使用

第一步, 打开 PowerShell 进入 D 盘: cd d:;

第二步, 执行命令 : hugo new site "blog";

第三步, 进入到 hugo 主题网站:https://themes.gohugo.io/ ,这里用 hugo-book主题 来演示;

第四步, 点击下载,进入 github 站点,下载 最新 releases 主题包;

第五步, 解压缩到 blog/themes 目录下,并修改 hugo.toml 文件,设置主题:theme = 'hugo-book-9'

除开下载源码安装的方式,四、五步也还有其他方式 比如:git submodule add https://github.com/alex-shpak/hugo-book themes/hugo-book 等,虽然方式不同主要目标都是将主题文件放在hugo themes文件下。

第六步,进入 D:\blog: cd .\blog\ ;然后执行 hugo serve -D 运行hugo自带的服务功能。

到这里,其实我们就能看到 利用hugo 搭建出来的默认站点了:http://localhost:1313/

Hugo 新增文档

在下载 hugo-book主题 的时候,里面就包含了 它的一些示例网页;只需要复制到 content 里面就能看到。由于使用的都是默认配置,这里仅拷贝docs/exampledocs/_index.md

当然,我们可以自己新建下 自己的 Markdown文件(hello.md);由于 快速使用中配置都为默认的,因此 我们需要在 docs下面进行创建,便于菜单吐出。

Hugo 的基本搭建就先介绍到这里了,后续如果有机会再分享 Hugo 配置、相关主题。

欢迎关注 Java研究者专栏、博客、公众号。

玩转开源 | 搭建 Hugo 管理 Markdown 文档的更多相关文章

  1. VS Code 搭建合适的 markdown 文档编写环境

    写在开头,之前我是使用Gitee与Github作为图床和Picgo搭配Typora使用的 ,但因为最近觉得这样还是稍微比较繁琐,然后因为VS Code是我的主要文本编辑器.Cpp,Python等均是在 ...

  2. 坚果云Markdown - 文档管理编辑器

    坚果云Markdown - 文档管理编辑器 Markdown是什么? Markdown是一种上手简单.应用十分广泛的轻量级标记语法.您可以使用Markdown轻松记录您的灵感.想法.创意.整个记录过程 ...

  3. 通过VuePress管理项目文档(一)

    VuePress 相关链接 完整的Vue组件代码以及完整的文档,仅适用于个人参考学习: 文档预览地址:预览链接 使用VuePress编辑文档的代码访问:组件文档 完整代码:组件代码 Vue组件开发 这 ...

  4. 一文搭建自己博客/文档系统:搭建,自动编译和部署,域名,HTTPS,备案等

    本文纯原创,搭建后的博客/文档网站可以参考: Java 全栈知识体系.如需转载请说明原处. 第一部分 - 博客/文档系统的搭建 搭建博客有很多选择,平台性的比如: 知名的CSDN, 博客园, 知乎,简 ...

  5. C#解析Markdown文档,实现替换图片链接操作

    前言 又是好久没写博客了 其实也不是没写,是最近在「做一个博客」,从2月21日开始,大概一个多星期的时间,疯狂刷进度,边写代码边写了一整系列的博客开发笔记,目前为止已经写了16篇了,然后上3月之后工作 ...

  6. Markdown 文档生成工具

    之前用了很多Markdown 文档生成工具,发现有几个挺好用的,现在整理出来,方便大家快速学习. loppo: 非常简单的静态站点生成器 idoc:简单的文档生成工具 gitbook:大名鼎鼎的文档协 ...

  7. 【原创】利用doxygen来管理项目文档或注释

    一.doxygen应用场景: doxygen可以用来管理目前主流的编程语言的注释而形成文档系统.(包括C, C++, C#, Objective-C, IDL, Java, VHDL, PHP, Py ...

  8. 基于 React 开发了一个 Markdown 文档站点生成工具

    Create React Doc 是一个使用 React 的 markdown 文档站点生成工具.就像 create-react-app 一样,开发者可以使用 Create React Doc 来开发 ...

  9. hugo官方相关文档地址

    +++ date="2020-10-17" title="hugo官方相关文档地址" tags=["hugo"] categories=[& ...

  10. go语言生成markdown文档工具

    虽然有go语言的swagger,但是go版本的swagger对代码的侵入比较大,因此抽空实现了基于GO语言生成markdown文档的工具 开源链接地址: https://github.com/w3li ...

随机推荐

  1. 整理不错的opencv博客

    https://me.csdn.net/column/u013095718 更全的博客: https://blog.csdn.net/zhmxy555/column/info/opencv-tutor ...

  2. vs(visual stuiod)中vc++工程的Filter和Folder及vcxproj知识

    vs中创建Filter 在一个新项目中右键 - Add - New,默认只有一选项 New Filter. 创建出来的Filter可以理解为是VS的过滤器(虚拟目录),它不会在本地的磁盘上新建目录,而 ...

  3. 配置MySQL主从复制(一主一从)

    前言 MySQL主从复制简介 MySQL主从复制的目的是实现数据库冗余备份,将master数据库的数据定时同步到slave库中,一旦master数据库宕机,可以将Web应用数据库配置快速切换到slav ...

  4. R2在全渠道业务线的落地

    随着业务的增长,系统的高频率迭代,质量保障工作迫切需要引入更加科学高效的测试方法来助力业务高质量的交付.长城项目一期测试中,全渠道质量团队引入技术平台部R2技术,极大的提升了项目交付的质量.因此,本文 ...

  5. Linux服务器的性能监控与分析

    通过vmstat分析性能  如上图所示,我们在命令vmstat后面添加了两个参数,1表示间隔一秒获取一次,10表示总共获取10次 我们一列一列数据来看: r:代表目前实际运行的指令队列,很高表示CPU ...

  6. 5、Mybatis之获取参数值

    5.1.创建新module 5.1.1.右击SSM文件夹,创建新module 5.1.2.选择maven 5.1.3.配置module名称和路径 5.1.4.module初始状态 5.1.5.复制打包 ...

  7. [超详细]SpringBoot整合WebSocket

    1. 什么是WebSocket? WebSocket 是一种在单个 TCP 连接上进行全双工通信的协议,它允许在浏览器和服务器之间进行实时的.双向的通信.相对于传统的基于请求和响应的 HTTP 协议, ...

  8. 《SQL与数据库基础》13. 视图

    目录 视图 简介 语法 检查选项 视图更新 视图作用 本文以 MySQL 为例 视图 简介 视图(View)是一种虚拟存在的表.视图中的数据并不在数据库中实际存在,行和列数据来自定义视图的查询中使用的 ...

  9. ECharts图表动态修改series显示隐藏

    目录 1.前言 2.思路 3.实现 1.前言 最近做的大数据平台,里面很多地方用到了ECharts,其中有个功能,要求将图表分组,根据用户选择的组,来确定ECharts要显示那些线条和柱子,也就是动态 ...

  10. Google Hacking语法总结

    Google Hacking语法总结 Google Hacking是利用谷歌搜索的强大,来在浩瀚的互联网中搜索到我们需要的信息.轻量级的搜索可以搜素出一些遗留后门,不想被发现的后台入口,中量级的搜索出 ...