【教程】从DecapCMS迁移到SveltiaCMS

838 字

4 分钟

【教程】从DecapCMS迁移到SveltiaCMS

2026-07-10

笔记

Sveltia

/

Decap

/

Fuwari

/

Astro

封面图：https://www.pixiv.net/artworks/113004958

前言：#

如Sveltia CMS简介里说的一样，Decap CMS大抵已经死了。难看的UI、缺少的功能、奇怪的Bug、无用的文档、聊胜于无的更新，看起来没有必要再待在这条千疮百孔的船上了。

幸运的是Sveltia很好的兼容了Decap，所以几乎不需要修改之前的Decap配置内容，而且也不是非要用Sveltia的OAuth 客户端，这都大幅度降低了我们从Decap迁移的难度。

简单配置下文件#

【笔记】基于Edgeone Pages部署Fuwari(Astro)博客+DecapCMS前文我们准备了src/pages/admin.html这个Decap专用的admin页面，现在不需要了，就把它删掉。

我们重新在/public/admin/新建一个index.html

1
<!DOCTYPE html>
2
<html>
3

4
<head>
5
    <meta charset="utf-8" />
6
    <meta name="robots" content="noindex" />
7
    <title>Sveltia CMS</title>
8
</head>
9

10
<body>
11
    <script src="https://fastly.jsdelivr.net/npm/@sveltia/cms/dist/sveltia-cms.js"></script>
12
</body>
13

14
</html>

Sveltia的config.yml配置文件如下

1
logo_url: Sveltia的logo位置
2

3
media_folder: "/src/content/posts/images" # 文件将被存储在仓库中的位置
4

5
collections:
6
    - name: "terminal" # 用于路由，例如，/admin/collections/blog
7
    label: "paper" # 在 UI 中使用
8
    folder: "src/content/posts" # 存储文档的文件夹路径
9
    create: true # 允许用户在此集合中创建新文档
10
    fields: # 每个文档的字段，通常在 front matter 中
11
            - { label: "标题", name: "title", widget: "string" }
12
            - { label: "发布日期", name: "published", widget: "datetime", type: "date" }
13
            - { label: "描述", name: "description", widget: "text", required: false }
14
            - { label: "封面图片", name: "image", widget: "image", default: "https://rdimg.yumehinata.com/random-wallpaper"}
15
            - { label: "标签", name: "tags", widget: "list", required: false }
16
            - { label: "分类", name: "category", widget: "string", required: false }
17
            - { label: "草稿状态", name: "draft", widget: "boolean", default: false }
18
            - { label: "正文", name: "body", widget: "richtext" }
19
    media_folder: "/src/content/posts/images/{{slug}}"
20
    public_folder: "./images/{{slug}}" # 上传媒体文件的 src 属性
21

22
i18n:
23
  structure: multiple_folders
24
  locales: ["zh-cn", "en"]
25
  default_locale: "zh-cn"
26
backend:
27
  name: github
28
  repo: "用户/仓库"
29
  branch: "main"
30
  api_root: "https://api.github.com"
31
  site_domain: "https://博客域名"
32
  base_url: "https://OAuth客户端域名"
33
  auth_endpoint: "auth"

这里就要说Sveltia的优势了。之前的Decap教程提到过，Fuwari的特殊功能导致了我们在编辑器中必须写./images这样的相对路径，但是public_folder是不允许写这种相对路径的（Sveltia的全局里也是不允许写的），但是collections:下的属性就不要紧了。所以我们现在全局里写一个media_folder，再在collections中补上public_folder、media_folder。当然实际需求请按自己的来。

而且这还顺带解决了我们替换编辑器的需求，这样【笔记】Fuwari主题下的DecapCMS编辑器替换也没有用了，Sveltia的编辑器可比Decap好用和美观多了。

另外，我们之前的教程被html文件中加载的yml文件的格式搞得头疼，现在Sveltia就不用担心这种奇怪的问题了（不知道比Decap高到哪里去了）。

下面的第三方 OAuth 客户端相关配置，还是可以参考之前的笔记内容。使用Edgeone Pages的大家还是可以用幻梦之前做好的客户端

YumeHinata

/

dacap-cms-edgeone-pages

Waiting for api.github.com...

00K

0K

Waiting...