申请抢先体验

请填写名字,以及邮箱或手机号。我们会与您联系,提供 Tajo 访问详情。

主题初始设置

  1. 开始之前,先用 npm installpnpm install 安装全部依赖包,然后运行一次初始构建,用 npm run buildpnpm build 确认整套环境可以正常工作。
  2. 把 Pagefind 的构建产物(用于站内搜索)复制到开发环境可以访问的位置。具体做法因操作系统而异,这里预置了几条命令来简化这一步。
    • Windows 上运行 npm run winsearch
    • macOS 或 Linux 上运行 npm run osxsearch
  3. 接下来配置站点的 i18n 方案(单语言或多语言都可以)。运行 npm run docs:config-i18n,按照脚本给出的提示一步步完成配置即可。
  4. 至此基础配置就完成了,你可以按照自己的需要继续定制整个站点。

代码导览

这里准备了几段代码导览,帮助你快速熟悉整个代码库。要在 VSCode 或其他 IDE 中查看,需要先安装 Code Tour 扩展。

代码结构

绝大部分代码都放在 src/docs 目录下。这样的组织方式便于把整个文件夹直接拷贝到已有项目中,几分钟内就能为项目加上完整的文档功能。

配置选项

站点的整体配置集中在 src/docs/config/ 文件夹中。大多数设置按语言拆分,分别放在各自的语言文件夹里,这样处理翻译时会更方便。

站点设置

src/docs/config/siteSettings.json.ts 文件用于配置站点级别的设置,例如是否启用视图过渡、是否启用动画,以及是否在文档标题旁显示复制链接按钮。

站点数据

src/docs/config/[language]/siteData.json.ts 文件用于配置站点数据,例如站点标题、站点描述、社交链接以及默认图片。

导航数据

顶部导航栏的导航数据在 src/docs/config/[language]/navData.json.ts 文件中配置。

侧边栏布局

文档各个章节的排列顺序在 src/docs/config/[language]/sidebarNavData.json.ts 文件中配置。

Robots

为了让 Google 等爬虫抓取到正确的站点地图,需要编辑 public/robots.txt 文件,把其中的域名换成你自己的网站域名。

更多资源

Astro 通用说明

Astro 会在 src/pages/ 目录中查找 .astro.md 文件,每个页面都会按照文件名映射为一条路由。

src/components/ 本身没有任何特殊之处,只是我们习惯把 Astro/React/Vue/Svelte/Preact 组件放在这里。

图片等静态资源可以放在 public/ 目录中。如果要用 Astro assets 做图片优化,也可以把图片放在 src/assets,这也是常用的做法。

命令

所有命令都在项目根目录下的终端中运行:

命令作用
npm install安装项目依赖
npm run devlocalhost:4321 启动本地开发服务器
npm run build把生产站点构建到 ./dist/
npm run preview部署前在本地预览构建结果
npm run astro ...运行 astro addastro check 等 CLI 命令
npm run astro -- --help查看 Astro CLI 的使用帮助

想了解更多?

可以查阅 官方文档,或者加入 Discord 服务器

申请抢先体验

请填写名字,以及邮箱或手机号。我们会与您联系,提供 Tajo 访问详情。

自动识别
AI 助手

你好!关于文档有任何问题都可以问我。