公告

👇公众号👇---👇 微信 👇

欢迎大家加群&私信交流

文章首/文尾有群二维码

Skip to content

快速上手

1分钟内完成自己的博客创建

注意事项

使用 pnpmyarnbun ,需要单独安装

如果喜欢尝鲜,想体验更快的启动和构建速度,推荐使用 bunwindows 用户不建议使用 bun

其它情况推荐使用 pnpm,不推荐使用 yarn

sh
npm install -g pnpm
sh
npm install -g bun

快速创建项目

使用 @sugarat/create-theme 快速创建模板项目

sh
npm create @sugarat/theme@latest
sh
yarn create @sugarat/theme
sh
pnpm create @sugarat/theme
sh
bun create @sugarat/theme
bun创建的项目不一样之处

① 会多出一个配置文件 bunfig.toml,默认配置了淘宝镜像源

② 安装依赖后对应lock文件 bun.lockb

③ 运行命令需添加一个 --bun 参数,不加就是Node运行,体验不到快速(未来官方会做优化)

当然你也可以自定义项目名创建

sh
npm create @sugarat/theme@latest my-first-blog
sh
yarn create @sugarat/theme my-first-blog
sh
pnpm create @sugarat/theme my-first-blog
sh
bun create @sugarat/theme my-first-blog

接下来按照 操作指引 进行操作即可

npm/yarn/pnpmbun

① 切换到项目的目录

sh
cd my-blog

② 安装依赖

sh
pnpm install
sh
bun install

③ 开发启动

sh
pnpm dev
sh
bun run --bun dev

你就会得到一个这样的页面

④ 构建产物

sh
pnpm build
sh
bun run --bun build

默认会开启内置的离线全文搜索(基于 pagefind 实现)

如果不需要可以在 docs/.vitepress/blog-theme.ts 中关闭

  • 如果npx pagefind 时间过长,可以手动将其安装为项目依赖 pnpm add pagefind
ts
const blogTheme = getThemeConfig({
  // 默认开启pagefind离线的全文搜索支持(如使用其它的可以设置为false)
  // 如果npx pagefind 时间过长,可以手动将其安装为项目依赖 pnpm add pagefind
  search: false,
})

⑤ 预览构建产物

sh
pnpm serve
sh
bun run --bun serve

升级

如果主题更新了,升级主题,原项目只需执行如下指令即可

sh
pnpm add @sugarat/theme@latest

# 更新 vitepress 版本(通常安装最新的即可,主题包每次更新不出意外都会使用最新的VitePress)
pnpm add vitepress@latest
sh
bun update @sugarat/theme

# 更新 vitepress 版本(通常安装最新的即可,主题包每次更新不出意外都会使用最新的VitePress)
bun install vitepress@latest

更多