mcpField
V
valaxy

valaxy

github.com/yunyoujun开发1.1k47 次安装3 天前更新
代码仓库

关于 valaxy

Valaxy 是基于 Vue 3 和 Vite 的静态博客框架,用于构建以 Markdown 为内容的站点。它结合文件路由与主题、插件配置,并允许用户组件覆盖主题或核心组件。

主要功能

  1. 01基于 Markdown 生成静态站点
  2. 02基于 Vue 3 和 Vite
  3. 03文件路由
  4. 04使用 frontmatter 设置文章元数据
  5. 05配置主题和插件
  6. 06自定义组件与样式

适用场景

  1. 01用 Markdown 文章创建静态博客
  2. 02按标签和分类组织文章
  3. 03通过多种语言选项构建本地化内容
  4. 04覆盖主题组件和样式

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/yunyoujun/valaxy --skill valaxy

安装后在 Claude Code 中输入/valaxy确认已加载。

附带文件references/architecture.mdreferences/theme-addon-dev.md

详细介绍

Valaxy

新一代静态博客框架:Vue 3 + Vite + UnoCSS + 基于文件的路由 + markdown-it。

快速参考

pnpm create valaxy          # scaffold new site
pnpm i                      # MUST use pnpm
pnpm dev                    # dev server at localhost:4859
pnpm build                  # SSG build to dist/

两个配置文件:

  • site.config.ts — 通过 defineSiteConfig() 配置站点元数据(标题、作者、社交信息、搜索、评论)
  • valaxy.config.ts — 通过 defineValaxyConfig<ThemeConfig>() 配置框架(主题、扩展、Markdown、Vite)
  • 可选的 theme.config.ts — 通过 defineThemeConfig() 配置主题专属选项

文章放在 pages/posts/*.md 中。Frontmatter 用于设置标题、日期、标签、分类、封面、草稿、加密、布局等。

关键模式

配置合并

配置来源通过 defu 合并(用户配置优先):默认配置 → 主题 → 扩展 → 用户配置。

文件解析(Roots 系统)
roots = [clientRoot, themeRoot, ...addonRoots, userRoot]

用户组件、布局和样式会覆盖主题中的对应项,主题中的对应项又会覆盖核心中的对应项——依据文件名匹配。

路由

通过 vue-router/vite 实现基于文件的路由。pages/ 中的文件会成为路由。布局会自动分配:

  • pages/posts/** → post 布局
  • pages/tags/** → tags 布局
  • pages/categories/** → categories 布局

可通过 frontmatter 中的 layout: xxx 覆盖。

集合

使用 defineCollection() 在 pages/collections/{name}/index.ts 中定义:

import { defineCollection } from 'valaxy'

export default defineCollection({
  key: 'hamster',
  title: 'Hamster Stories',
  items: [
    { title: 'Chapter 1', key: '1' },
  ],
})
i18n
  • 基于 CSS 的双语:在 Markdown 中使用 ::: zh-CN / ::: en 容器
  • 基于文件:locales/*.yml
  • Frontmatter:title: { en: 'Title', 'zh-CN': '标题' }
  • 标签:$locale:tag.notes 语法
自定义样式

创建 styles/index.ts(或 .scss/.css)——会自动加载。可覆盖 CSS 变量来设置主题。

自定义组件

将 .vue 文件放在 components/ 中——它们会自动注册,并按名称覆盖主题或核心组件。

Monorepo 开发

在开发 Valaxy 核心框架时:

pnpm i                     # install all workspace deps
pnpm run build             # build core: utils → valaxy → devtools
pnpm dev:lib               # watch core packages
pnpm demo                  # run demo site
pnpm docs:dev              # run docs site
pnpm test                  # unit tests (vitest)
pnpm e2e                   # E2E tests (playwright)
pnpm lint                  # eslint
pnpm typecheck             # type check
仓库 URL 规范化

显示来自 package.json 的仓库 URL 时,从 @valaxyjs/utils 导入并使用 normalizeRepositoryUrl(),以移除 git+ 前缀。

参考资料

  • 根据简要说明生成或重新设计主题:使用此仓库专用的 valaxy-theme skill(pnpm dlx skills add YunYouJun/valaxy --skill valaxy-theme)。该 skill 涵盖可运行的主题/演示、UI 库集成和验证。

  • 框架架构、虚拟模块、组合式函数、组件:阅读 references/architecture.md

  • 主题/扩展开发、文章 frontmatter、扩展图库:阅读 references/theme-addon-dev.md

评论

支持 Markdown