CMS后端前端插件系统【免费下载链接】emdashEmDash is a full-stack TypeScript CMS based on Astro; the spiritual successor to WordPress项目地址https://gitcode.com/gh_mirrors/emdas/emdash点击查看免费下载导读templates/starter-cloudflare是 EmDash 官方提供的通用起步模板它把一个带完整管理后台的 Astro CMS 站点直接部署到 Cloudflare Workers 之上使用 D1 作为数据库、R2 作为媒体存储站点默认包含 posts / pages 两个内容集合以及 category / tag 两个分类法。读完本文你将掌握该模板的文件结构、核心命令、schema 定义方式、服务端渲染SSR规范并能在其基础上快速搭建属于你自己的内容站点或将其替换为 blog / portfolio / marketing 等带完整视觉系统的模板。模板定位最小化、不预设视觉风格该模板的定位是一个「通用起点」包含 posts、pages、categories、tags但没有预置theme.css、没有自定义字体配置、也没有超越浏览器默认样式的排版。主页、文章列表、文章详情、页面、分类页、标签页全部以极简样式渲染templates/starter-cloudflare/CLAUDE.md。这带来的结果是该模板的定制工作是「做加法」而不是「做减法」——自带内容、schema、路由与后台只缺设计层。如果你想要开箱即用的设计模板应改用blog、portfolio或marketing它们都带可通过theme.css换肤的完整视觉系统。常用命令与后台入口模板在 package.json 中预置了五组脚本pnpm dev # 启动 Astro 开发服务器等价于 astro dev pnpm build # 构建生产版本astro build pnpm preview # 本地预览构建产物astro preview pnpm deploy # 构建后通过 wrangler deploy 发布到 Cloudflare Workers pnpm typecheck # 用 astro check 做类型检查针对 EmDash 特有的两个高频命令pnpm dev # 启动 Astro 开发服务器 npx emdash types # 基于运行中的站点重新生成 TypeScript 类型管理后台地址固定为http://localhost:4321/_emdash/admintemplates/starter-cloudflare/CLAUDE.md。emdash-env.d.ts中的集合类型会在开发服务器启动时自动重新生成npx emdash types用于手动触发同一过程。关键文件速览文件用途astro.config.mjsAstro 配置注册emdash()集成、数据库与存储绑定src/live.config.tsEmDash loader 注册样板代码不要修改seed/seed.jsonSchema 定义 演示内容集合、字段、分类法、菜单、widgetsemdash-env.d.ts集合的生成类型开发服务器启动时自动重新生成src/layouts/Base.astro基础布局包含 EmDash 接线菜单、搜索、页面贡献src/pages/Astro 页面全部服务端渲染配置层D1 数据库 R2 媒体存储astro.config.mjs 是理解模板运行环境的关键。它做了四件事声明output: server——这是 EmDash 内容站点必须的 SSR 模式挂载astrojs/cloudflare适配器通过emdash-cms/cloudflare包提供d1()与r2()两个适配函数分别绑定 D1 数据库binding 为DB与 R2 媒体桶binding 为MEDIAsession: auto表示 D1 会话由集成自动管理注册emdash()集成并关闭devToolbar。对应的 wrangler.jsonc 声明了 Worker 运行时环境compatibility_date与nodejs_compat兼容标志、名为my-emdash-site的 D1 数据库、名为my-emdash-media的 R2 桶以及一个每分钟触发的crons维护定时器* * * * *。文件里还注释说明了沙箱化插件需要 Worker LoaderWorkers 付费计划如需启用可取消worker_loaders绑定的注释。Worker 入口 src/worker.ts 从emdash-cms/cloudflare/worker引入默认 handler、createScheduledHandler与PluginBridge并导出scheduled定时处理——这是模板能运行维护型定时任务的底层接线。数据层live.config.ts 与 loader 注册src/live.config.ts 全文只有 6 行通过astro:content的defineLiveCollection配合emdash/runtime的emdashLoader()注册一个名为_emdash的 live collection。它把 EmDash 的内容查询能力接入 Astro Content Layer是页面中getEmDashCollection/getEmDashEntry等 API 能够工作的前提因此模板明确标注「boilerplate — dont modify」。Schema 详解seed.json模板的数据模型全部定义在 seed/seed.json 中它同时承担 schema 定义与演示内容两种职责package.json里的emdash: { seed: seed/seed.json }字段将其与 CLI 工具关联。集合与字段poststitlestring必填、可搜索、featured_imageimage、contentportableText可搜索、excerpttext支持 drafts / revisions / search / seopagestitlestring必填、可搜索、contentportableText可搜索带urlPattern: /{slug}支持 drafts / revisions / search。分类法与菜单分类法category层级化hierarchical: true预置general、updates两个 term与tag非层级化预置starter、example都只挂载在posts集合上单一primary菜单包含 Home、Posts、About 三个自定义链接widgetAreas定义了一个名为sidebar的 widget 区域预置了三个组件 widgetcore:search搜索、core:categories分类列表、core:recent-posts最近文章count: 5。演示内容seed 内还包含一页/about与一篇文章/posts/welcome。文章的content以 Portable Text 块结构书写_type: block_type: span的 children并演示了taxonomies字段如何关联category与tag的 term slug。站点设置settings只有titleMy Site与taglineBuilt with EmDash两个字段与src/utils/site-identity.ts中的resolveStarterSiteIdentity工具函数对应——该函数把设置解析为siteTitle/siteTagline/siteLogo并在无设置时回退到My Site/Built with EmDash默认值。页面路由与服务端渲染模板的src/pages/下所有页面均为 SSRoutput: server不适用getStaticPaths()。路由清单templates/starter-cloudflare/CLAUDE.md页面路径展示内容Home/站点标题 tagline链接到 Posts / AboutAll posts/posts文章列表Post detail/posts/[slug]文章内容Page/[slug]静态页面内容如/aboutCategory/category/[slug]按分类过滤的文章Tag/tag/[slug]按标签过滤的文章主页与列表页的查询模式src/pages/index.astro 演示了最基础的查询getEmDashCollection(posts, { orderBy: { published_at: desc } })按发布时间倒序取文章并通过Astro.cache.set(cacheHint)写入缓存提示Cloudflare 适配器会把它转换为页面缓存。首页还会在无文章时输出一个指向/emdash/admin/content/posts/new的「创建文章」链接。文章列表页 templates/starter-cloudflare/src/pages/posts/index.astro 则演示了批量查询 taxonomy 的优化做法先用getEmDashCollection取全部文章再用getTermsForEntries(posts, posts.map(p p.data.id), tag)一次性批量获取所有文章的标签映射避免对每篇文章单独调用getEntryTerms造成 N 次往返。详情页、分类页与标签页文章详情页 templates/starter-cloudflare/src/pages/posts/[slug].astro 是内容型页面的完整示例用decodeSlug(Astro.params.slug)解码 slug非法或未命中时Astro.redirect(/404)getEmDashEntry(posts, slug)取单条 entry并通过getSeoMeta基于内容字段生成 SEO metatitle / description / canonical / ogImage传入Base布局post.data.terms?.tag ?? []与post.data.terms?.category ?? []读取由getEmDashEntry预先水合hydrate好的分类法 term用emdash/ui的PortableText渲染 Portable Text 正文用Image渲染图片字段关键细节编辑高亮依赖{...post.edit.featured_image}与{...post.edit.title}属性展开这是 EmDash 可视化编辑能力的接线点。通用页面 templates/starter-cloudflare/src/pages/[slug].astro 结构相同仅渲染title与PortableText正文。分类页与标签页category/[slug].astro、tag/[slug].astro模式一致先getTerm(category | tag, slug)取 term再用getEmDashCollection(posts, { where: { category: term.slug } })或{ where: { tag: term.slug } }过滤文章。基础布局 Base.astrosrc/layouts/Base.astro 承担所有页面的外壳通过getMenu(primary)取菜单、getSiteSettings()取站点身份并渲染导航栏导航内嵌emdash/ui/search的LiveSearch搜索集合限定为posts与pages通过createPublicPageContext创建公共页面上下文区分 content / custom 两种页面类型并渲染EmDashHead、EmDashBodyStart、EmDashBodyEnd三兄弟组件完成 SEO、脚本与插件页面贡献page contributions的注入footer里通过WidgetArea namesidebar /渲染 sidebar widget 区域。必须遵守的编码规则CLAUDE.md 明确列出了在模板中开发时必须遵守的五条硬性规则templates/starter-cloudflare/CLAUDE.md它们直接决定代码能否在 Cloudflare 环境下正确工作所有内容页面必须服务端渲染output: server禁止对 CMS 内容使用getStaticPaths()图片字段是对象{ src, alt }而非字符串必须用emdash/ui导出的Image image{...} /渲染——这在所有页面示例中均有体现entry.id是 slug用于 URL而entry.data.id是数据库 ULID用于getEntryTerms等 API 调用——例如列表页批量取标签时传的是post.data.id而拼链接时用的是post.id查询内容的页面必须调用Astro.cache.set(cacheHint)查询中的 taxonomy 名称必须与 seed 的name字段完全一致如category而非categories。视觉定制从零开始建立设计系统模板刻意不施加任何视觉风格「None imposed. Define your own.」它默认不包含templates/starter-cloudflare/CLAUDE.mdsrc/styles/theme.css——需要 CSS 变量主题时创建它并从Base.astro引入astro.config.mjs中的字体——fonts: []为空数组需要 web 字体时按cssVariable绑定方式添加 Google Fonts 条目带样式的components/目录卡片、标签列表等——按需自行构建。合理的首轮定制步骤templates/starter-cloudflare/CLAUDE.md选择一套展示字体 一套正文字体写入astro.config.mjs并绑定到--font-display与--font-bodyCSS 变量创建src/styles/theme.css定义配色、字号阶梯与间距 token在Base.astro中引入——布局已经自带一个小型 reset把主题样式放在页面样式之上在各个 Astro 页面的style块中引用这些 CSS 变量构建页面级样式。同时有三条「不要做」的边界templates/starter-cloudflare/CLAUDE.md不要把它当作成品设计——无样式输出是有意为之直接上线会显得未完成不要不加考虑地引入组件库Tailwind UI、shadcn 等——模板「小」是刻意设计不要在这里复刻 blog 模板的三栏阅读视图——想要那种效果应直接从blog模板开始。Agent 技能与文档支持模板面向 AI 编码助手做了完整铺垫templates/starter-cloudflare/CLAUDE.md。仓库根目录下对应三份技能文档building-emdash-siteskills/building-emdash-site/SKILL.md——内容查询、Portable Text 渲染、schema 设计、seed 文件、站点特性菜单、widgets、搜索、SEO、评论、byline建议从这里开始creating-pluginsskills/creating-plugins/SKILL.md——用 hooks、storage、管理后台 UI、API 路由与 Portable Text 块类型构建 EmDash 插件emdash-cliskills/emdash-cli/SKILL.md——内容管理、seeding、类型生成与可视化编辑流程相关的 CLI 命令。EmDash 官方文档还以 MCP 服务器形式提供https://docs.emdashcms.com/mcp当需要核对某个 API、hook、配置项、字段类型或模式时应通过search_docs查询实时文档而不是依赖训练数据的记忆。模板随附.mcp.json、.cursor/mcp.json与.vscode/mcp.jsonClaude Code、Cursor、VS Code 会自动发现文档服务器其他工具OpenCode、Windsurf 等需要一次性手动配置。总结从模板到站点的路径starter-cloudflare的价值在于它把「能跑起来的 EmDash 站点」压缩到最小SSR 渲染、D1 R2 存储、完整的 posts/pages/category/tag 内容模型、后台管理界面与搜索都已就绪剩下的工作全部集中在视觉层。你可以沿用它的查询与渲染模式参考 templates/starter-cloudflare/src/pages 下每个页面的写法配合 templates/starter-cloudflare/seed/seed.json 扩展自己的集合与字段也可以直接改用带完整视觉系统的blog、portfolio或marketing模板再通过theme.css换肤。赞分享CMS后端前端插件系统【免费下载链接】emdashEmDash is a full-stack TypeScript CMS based on Astro; the spiritual successor to WordPress项目地址https://gitcode.com/gh_mirrors/emdas/emdash点击查看免费下载相关推荐深入解析 EmDash blog-cloudflare 模板在 Astro 上构建部署于 Cloudflare Workers 的 CMS 博客深入解析 EmDash blog cloudflare 模板在 Astro 上构建部署于 Cloudflare Workers 的 CMS 博客 导读 temCMS后端前端插件系统EmDash Cloudflare Demo 实战指南在 Workers D1 上运行 Astro 驱动的全栈 CMSEmDash Cloudflare Demo 实战指南在 Workers D1 上运行 Astro 驱动的全栈 CMS 本指南以仓库中的 demos/clCMS后端前端插件系统EmDash 博客模板Cloudflare 版实战指南基于 Astro D1 R2 的编辑器优先 CMS 站点搭建EmDash 博客模板Cloudflare 版实战指南基于 Astro D1 R2 的编辑器优先 CMS 站点搭建 本指南围绕 EmDash 官方CMS后端前端插件系统上一篇解锁OrcaSlicer从源码编译到定制化开发的实战指南下一篇2025年扩散模型架构演进从U-Net基础到多模态融合创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考