介绍

欢迎了解 Hollow,Hollow 是一个极简、自由的静态网站生成器。你几乎不用学习 Hollow 创造的概念,会 Jsx 与 Js 即可生成网站。

特性

  • Golang 与 Js 驱动
    • 支持 Js/Ts 作为配置文件(yaml 也支持)
    • 使用 Jsx/Tsx 作为主题模板开发语言
  • 主题开发没有限制,代码即所得。
  • 支持 MDX
  • 快速:生成 1000 篇页面只需要 2s (虽然没什么用)
  • 支持部署到服务器,提供 Web UI 管理文章
  • 在任何地方(如手机上)管理你的文章
  • 云端文件支持同步到 Git 上,不怕文件丢失

适用于

  • "想要从零开发主题、网站,但不愿被框架限制" 的人
  • "需要使用 Web UI 写作" 的人

Hollow 世界观

在 Hollow 的世界中,代码即所得,因为主题使用 JavaScript 驱动,它是图灵完备的,所以没必要再定义限制:如路由、布局、标签、归档等。不再拘谨于框架给你的概念,这次你自己创造。

当你想要实现更多需求的时候,最好的方式是自己开发"主题",而不是让某个"主题"提供给你功能。

在大多数时候,复制一个已有的主题再更改更简单

主题只有一个入口,即 index.tsx,和一个平常的 JavaScript 项目一样,支持 import 或 require 语法,如何组织你的主题,这完全取决于你。

借助于 Jsx 语法,主题开发是很简单的,比如一个最简单的主题只有一个文件:

// index.tsx
function Index(props) {
  return <html lang="zh" class="dark">
  <head>
    <meta charSet="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>{props.title || 'UnTitled'}</title>
  </head>
  <body className="">
  <div>
    {props.body}
  </div>

  </body>
  </html>
}

export default {
    pages: [
        {
            path: '',
            component: () => {
                return <Index title={"Hi!"} body={"I am hollow"}></Index>
            },
        },
    ],
}

当然这个简单的主题通常是不够用的,这里只是介绍下开发主题足够简单,有关开发主题的详细文档可查看:主题开发

文章管理

和大多数博客生成器一样,你可以使用 Markdown 语法来编写文章,除了 Markdown 语法,MDX 语法 Hollow 也借鉴了过来,不过由于 MDX 十分复杂,Hollow 只实现了子集。

一个 md/mdx 例子文件如下:

---
title: 开发主题
desc:
slug: theme-dev
sort: 1
---

export let A = (src)=> {return <img src={src}>}

## SubTitle

<A src="./jpg"></A>

其中 meta 完全由主题而不是 Hollow 指定,你可以翻阅主题文档来查看其支持的 meta。

详细内容请看:管理文章 章节

© 2023 Hollow's Blog - Tailwindcss + Hollow

GitHub