欢迎来到我的新网站！

这是我从 DokuWiki 迁移到 Quartz 后写的第一段话。

为什么选择 Quartz？

主要是我的水平不够切换到Quartz，文件在本地会更清晰结构比较简单。

在mac安装Quartz

需要先安装Node.js

git clone https://github.com/jackyzha0/quartz.git
cd quartz
npm i
npx quartz create
npx quartz build --serve

侧边栏的排序

在文件顶部加上 order 属性：

---
title: 2025
order: 1
---

修改 quartz.layout.ts 配置文件

import { PageLayout, SharedLayout } from "./quartz/cfg"
import * as Component from "./quartz/components"

// --- 提取出来的公共排序规则 ---
const mySortFn = (a: any, b: any) => {
  // 1. 获取 order 属性，没写的话默认给 100
  const orderA = (a.file?.frontmatter?.order as number) ?? 100;
  const orderB = (b.file?.frontmatter?.order as number) ?? 100;

  // 2. 如果设置了 order，按 order 从小到大排
  if (orderA !== orderB) {
    return orderA - orderB;
  }

  // 3. 如果没设置 order，按名字【从大到小】（倒序）排列！注意这里是 b 对比 a
  return b.displayName.localeCompare(a.displayName, undefined, {
    numeric: true,
    sensitivity: "base",
  });
};
// ------------------------------

// components shared across all pages
export const sharedPageComponents: SharedLayout = {
  head: Component.Head(),
  header: [],
  afterBody: [],
  footer: Component.Footer({
    links: {
      GitHub: "https://github.com/jackyzha0/quartz",
      "Discord Community": "https://discord.gg/cRFFHYye7t",
    },
  }),
}

// 单篇文章页的布局
export const defaultContentPageLayout: PageLayout = {
  beforeBody: [
    Component.ConditionalRender({
      component: Component.Breadcrumbs(),
      condition: (page) => page.fileData.slug !== "index",
    }),
    Component.ArticleTitle(),
    Component.ContentMeta(),
    Component.TagList(),
  ],
  left: [
    Component.PageTitle(),
    Component.MobileOnly(Component.Spacer()),
    Component.Flex({
      components: [
        { Component: Component.Search(), grow: true },
        { Component: Component.Darkmode() },
        { Component: Component.ReaderMode() },
      ],
    }),
    // 【修复点 1】：应用自定义排序
    Component.Explorer({ sortFn: mySortFn }), 
  ],
  right: [
    Component.Graph(),
    Component.DesktopOnly(Component.TableOfContents()),
    Component.Backlinks(),
  ],
}

// 文件夹/标签列表页的布局
export const defaultListPageLayout: PageLayout = {
  beforeBody: [Component.Breadcrumbs(), Component.ArticleTitle(), Component.ContentMeta()],
  left: [
    Component.PageTitle(),
    Component.MobileOnly(Component.Spacer()),
    Component.Flex({
      components: [
        { Component: Component.Search(), grow: true },
        { Component: Component.Darkmode() },
      ],
    }),
    // 【修复点 2】：这里也必须应用自定义排序，否则进入文件夹后排序会乱
    Component.Explorer({ sortFn: mySortFn }), 
  ],
  right: [],
}

发布到网络