Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

i18n(zh-CN): Update getting-started.mdx #1165

Merged
merged 2 commits into from
Nov 29, 2023
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
99 changes: 73 additions & 26 deletions docs/src/content/docs/zh-cn/getting-started.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -5,33 +5,34 @@ description: 了解如何使用 Astro 的 Starlight 开始构建下一个文档

import { Tabs, TabItem } from '@astrojs/starlight/components';

## 创建一个新项目

Starlight 是一个基于 [Astro](https://astro.build) 框架构建的全功能文档主题。
查看 [手动配置](/zh-cn/manual-setup/) 以将Starlight添加到现有的Astro项目中。
这个指南将帮助你开始一个新项目。

## 快速入门

你可以使用以下命令创建一个新的 Astro + Starlight 项目:
### 创建一个新项目

在你的终端中运行以下命令来创建一个新的Astro + Starlight项目:

<Tabs>
<TabItem label="npm">

```sh
# 使用 npm 创建一个新项目
npm create astro@latest -- --template starlight
```

</TabItem>
<TabItem label="pnpm">

```sh
# 使用 pnpm 创建一个新项目
pnpm create astro --template starlight
```

</TabItem>
<TabItem label="Yarn">

```sh
# 使用 yarn 创建一个新项目
yarn create astro --template starlight
```

Expand All @@ -45,24 +46,69 @@ yarn create astro --template starlight
[在 StackBlitz 上打开模板](https://stackblitz.com/github/withastro/starlight/tree/main/examples/basics)。
:::

## 使用 Starlight 创建内容
### 启动开发服务器

Starlight 已经准备好让你添加新的内容,或者将你现有的文件带过来!
在本地工作时,[Astro的开发服务器](https://docs.astro.build/zh-cn/reference/cli-reference/#astro-dev)允许你预览你的工作,并在你进行更改时自动刷新你的浏览器。

### 文件格式
在你的项目目录中,运行以下命令来启动开发服务器:

Starlight 支持使用 Markdown 和 MDX 来编写内容。(你可以通过安装实验性的 [Astro Markdoc 集成](https://docs.astro.build/zh-cn/guides/integrations-guide/markdoc/) 来添加对 Markdoc 的支持。)
<Tabs>
<TabItem label="npm">

### 添加页面
```sh
npm run dev
```

在 `src/content/docs/` 中创建 `.md` 或 `.mdx` 文件,就可以自动将新页面添加到你的站点中。添加子文件夹来组织你的文件,并创建多个路径段:
</TabItem>
<TabItem label="pnpm">

```sh
pnpm dev
```
src/content/docs/hello-world.md => your-site.com/hello-world
src/content/docs/guides/faq.md => your-site.com/guides/faq

</TabItem>
<TabItem label="Yarn">

```sh
yarn dev
```

### 类型安全的 frontmatter
</TabItem>
</Tabs>

这将在你的终端上记录一个包含本地预览网址的消息。
打开这个网址开始浏览你的网站。

### 添加内容

Starlight已经准备好让你添加新内容或导入你现有的文件!

#### 文件格式

Starlight支持在Markdown和MDX中编写内容,无需进行任何配置。
你可以通过安装实验性的[Astro Markdoc](https://docs.astro.build/zh-cn/guides/integrations-guide/markdoc/)集成来添加对Markdoc的支持。

#### 添加页面

通过在 `src/content/docs/` 中创建 `.md` 或 `.mdx` 文件来为你的站点添加新页面。
使用子文件夹来组织你的文件并创建多个路径段。

例如,以下文件结构将在 `example.com/hello-world` 和 `example.com/guides/faq` 生成页面:

import FileTree from '../../../components/file-tree.astro';

<FileTree>

- src/
- content/
- docs/
- guides/
- faq.md
- hello-world.md

</FileTree>

#### 类型安全的 frontmatter

所有 Starlight 页面都共享一个可自定义的 [frontmatter 属性集](/zh-cn/reference/frontmatter/),用于控制页面的外观:

Expand All @@ -75,16 +121,19 @@ description: This is a page in my Starlight-powered site

如果你忘记了任何重要的东西,Starlight 会提醒你。

## 部署你的 Starlight 网站
### 下一步

一旦你创建并自定义了你的 Starlight 网站,你就可以将它部署到你选择的 web 服务器或托管平台上,包括 Netlify、Vercel、GitHub Pages 等等。

[在 Astro 文档中了解如何部署 Astro 网站。](https://docs.astro.build/zh-cn/guides/deploy/)
- **配置:** 在[自定义 Starlight](/zh-cn/guides/customization/)中了解常见选项。
- **导航:** 使用[侧边栏导航](/zh-cn/guides/sidebar/)指南设置你的侧边栏。
- **组件:** 在[组件](/zh-cn/guides/components/)指南中发现内置的卡片、标签页等更多内容。
- **部署:** 使用Astro文档中的[部署你的 Astro 站点](https://docs.astro.build/zh-cn/guides/deploy/)指南发布你的站点。

## 更新 Starlight

:::tip[提示]
由于 Starlight 是 beta 软件,所以会经常更新和改进。请务必定期更新 Starlight!
由于 Starlight 是 beta 软件,所以会经常更新和改进。

请务必定期更新 Starlight!
:::

Starlight 是一个 Astro 集成,可以像任何 `@astrojs/*` 集成一样更新:
Expand All @@ -93,37 +142,35 @@ Starlight 是一个 Astro 集成,可以像任何 `@astrojs/*` 集成一样更
<TabItem label="npm">

```sh
# 使用 npm 升级 Starlight
npm install @astrojs/starlight@latest
```

</TabItem>
<TabItem label="pnpm">

```sh
# 使用 pnpm 升级 Starlight
pnpm upgrade @astrojs/starlight --latest
```

</TabItem>
<TabItem label="Yarn">

```sh
# 使用 yarn 升级 Starlight
yarn upgrade @astrojs/starlight --latest
```

</TabItem>
</Tabs>

你可以在 [Starlight 更新日志](https://github.com/withastro/starlight/blob/main/packages/starlight/CHANGELOG.md) 中查看每个版本的变动列表
查阅 [Starlight 更新日志](https://github.com/withastro/starlight/blob/main/packages/starlight/CHANGELOG.md)中每个版本的变更列表

## Starlight 故障排除

本站点的参考部分提供了 Starlight [项目配置](/zh-cn/reference/configuration/)和[单个页面 frontmatter 配置](/zh-cn/reference/frontmatter/)信息。使用这些页面来确保你的 Starlight 网站已正确配置和运行。

请参阅侧边栏中不断增长的指南列表,以获取有关添加内容和自定义 Starlight 网站的帮助。
请参阅侧边栏中的指南列表,以获取有关添加内容和自定义 Starlight 网站的帮助。

如果你在这些文档中找不到答案,请访问[完整的 Astro 文档](https://docs.astro.build) 以获取完整的 Astro 文档。你的问题可能是通过了解 Starlight 主题下 Astro 的工作原理来解决的。
如果你在这些文档中找不到答案,请访问[完整的 Astro 文档](https://docs.astro.build/zh-cn/) 以获取完整的 Astro 文档。
你的问题可能是通过了解 Starlight 主题下 Astro 的工作原理来解决的。

你也可以检查任何已知的 [GitHub 上的 Starlight issues](https://github.com/withastro/starlight/issues),并在 [Astro Discord](https://astro.build/chat/) 上从我们活跃的、友好的社区中获得帮助!在我们的 `#support` 论坛中发布带有 “starlight” 标签的问题,或者访问我们专门的 `#starlight` 频道来讨论当前的开发和更多内容!