人们喜欢 Markdown 文本是有充分理由的——它易于编写、易于阅读、易于编辑，并且可以转换为各种其他文本标记格式。虽然 Markdown 文本非常适合内容创建和操作，但它对内容显示选项施加了限制。
如果我们可以将 Markdown 的优点与层叠样式表、HTML5 和 JavaScript 的强大功能和灵活性相结合，那将是非常特别的。 Hugo 就是尝试做到这一点的程序之一。 Hugo 由 Steve Francia 于 2013 年创建；它是跨平台的开源软件，采用 Apache 2.0 许可证，拥有活跃的开发者社区和不断增长的用户群。
基本概念是将以 Markdown 编写并与元数据关联的内容（例如网页或博客文章）转换为 HTML，并与模板和主题结合以生成完整的网站。 强大功能和灵活性来自这些主题和模板，或者更改 Hugo 的默认行为。 这种强大功能带来了一定程度的不可避免的复杂性，但是如果您没有时间和意愿制作自己的模板，则可以使用许多 预构建模板。
在我的 Linux 机器上安装 Hugo 既快速又容易。 启动一个新项目就像在命令行中输入 hugo new site quickstart 一样简单，这将创建一个具有以下文件夹结构的新项目
- archetypes：内容模板文件，其中包含预配置的前言元数据（日期、标题、草稿）。 您可以使用自定义前言字段创建新的原型。
- assets：存储 Hugo Pipes 处理的所有文件（例如，CSS/Sass 文件）。 默认情况下不创建此目录。
- config.toml：默认站点配置文件。
- content：所有内容 Markdown 文件都位于此处。
- data：用于存储 Hugo 在生成网站时可以使用的配置文件。
- layouts：将模板存储为 .html 文件。
- static：存储所有静态内容——图像、CSS、JavaScript 等。
- themes：用于您选择的 Hugo 主题。
内容文件夹中的 Markdown 文件可以手动或由 Hugo 创建，并使用任何文本编辑器或您选择的 Markdown 创建工具进行编辑。 如果是手动创建，您需要添加任何需要的元数据。 我更喜欢使用 Ghostwriter 来编写 Markdown。 图像通常保存在 static 文件夹的子文件夹中。 网站开发可以快速进行，因为 Hugo 包含一个用于测试和预览的 Web 服务器。
要检查您的工作，请在命令行中输入 hugo server 以启动服务器。 默认情况下，Hugo 不会发布
- 具有未来 publishdate 值的内容。
- 状态为 draft: true 的内容。
- 具有过去 expirydate 值的内容。
添加 hugo server -D 将包含草稿文章，并且可以将 Hugo 配置为将所有新文章标记为草稿。 启动 Web 服务器后，您可以在 Web 浏览器中通过 localhost:1313 查看您的工作。 一旦服务器默认启动，当它检测到您的文件之一发生更改时，它将自动重新加载浏览器窗口。
有些任务 Markdown 无法完成，需要一些 HTML 代码。 Hugo 意识到了这一点，但坚持保持 Markdown 代码尽可能干净、简单和整洁。 Hugo 通过短代码来做到这一点，例如 {{< youtube id= "w7Ft2ymGmfc" autoplay= "true">}}，这将嵌入 id 为 w7Ft2ymGmfc 的 YouTube 视频。 有相当多的用于常见任务的预构建短代码，但也可以为特定任务创建自己的短代码。
我从事教育工作很多，并且想在我的 Hugo 生成的网站上包含一些互动谜题和问题。 为了使输出看起来像这样
我使用名为 JClic 的开源 Java 程序创建了这些活动，将它们导出为 HTML5，将其放入 static/activities/excel 中，并在 iframe 中显示它。
HTML 代码会破坏干净整洁的 Markdown 内容，看起来像这样
<iframe
src="https://open-source.net.cn/activity/excel/index.html"
title="Activity"
height="400"
frameborder="0"
marginwidth="0"
marginheight="0"
scrolling="no"
style="border: 1px solid #CCC; border-width: 1px; margin-bottom: 20px; width: 100%;"
allowfullscreen="true">
</iframe>代码保存在 layouts/shortcodes 中，文件名为 activity.html
这使得放置在我的 Markdown 文件中的短代码为 {{<activity>}}，这简洁得多。
当您的项目准备就绪时，您可以使用 hugo 命令构建它；这将创建一个 public 文件夹并在其中生成网站。 Hugo 具有许多针对不同托管提供商的内置部署选项——基本上，您可以通过将 public 文件夹复制到您的生产 Web 服务器来部署您的站点。 Hugo 还有很多我尚未涉及的内容，包括配置选项、从其他静态站点生成器和 Wordpress 导入内容、显示来自 JSON 文件的数据、源代码的语法突出显示以及它非常快（在处理大型站点时是一个优势）。
在许多软件工具中，易用性是以牺牲灵活性为代价的，反之亦然； Hugo 在同时包含两者方面做出了很大程度的成功尝试。 对于使用 Markdown 内容和预构建主题的基本用途，Hugo 易于使用并产生快速的结果。 或者，如果您需要更改配置设置或深入创建自己的主题、短代码、模板或元数据方案，您可以选择这样做。
1 条评论