create-rspress 2.0.4 → 2.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +3 -3
- package/template-basic/docs/_nav.json +6 -6
- package/template-basic/docs/api/_meta.json +1 -0
- package/template-basic/docs/api/commands.mdx +7 -0
- package/template-basic/docs/api/index.mdx +6 -0
- package/template-basic/docs/guide/_meta.json +12 -1
- package/template-basic/docs/guide/start/_meta.json +1 -0
- package/template-basic/docs/guide/start/getting-started.md +50 -0
- package/template-basic/docs/guide/start/introduction.md +15 -0
- package/template-basic/docs/guide/use-mdx/_meta.json +1 -0
- package/template-basic/docs/guide/use-mdx/code-blocks/_meta.json +1 -0
- package/template-basic/docs/guide/use-mdx/code-blocks/index.mdx +9 -0
- package/template-basic/docs/guide/use-mdx/code-blocks/meta.md +7 -0
- package/template-basic/docs/guide/use-mdx/code-blocks/title.md +5 -0
- package/template-basic/docs/guide/use-mdx/components.mdx +47 -0
- package/template-basic/docs/guide/use-mdx/container.md +33 -0
- package/template-basic/docs/index.md +10 -4
- package/template-basic/docs/guide/index.md +0 -216
- package/template-basic/docs/hello.md +0 -5
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "create-rspress",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.6",
|
|
4
4
|
"description": "Create a new Rspress project",
|
|
5
5
|
"homepage": "https://rspress.rs",
|
|
6
6
|
"repository": {
|
|
@@ -26,8 +26,8 @@
|
|
|
26
26
|
"create-rstack": "1.8.0"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
|
-
"@microsoft/api-extractor": "^7.57.
|
|
30
|
-
"@rslib/core": "0.
|
|
29
|
+
"@microsoft/api-extractor": "^7.57.7",
|
|
30
|
+
"@rslib/core": "0.20.0",
|
|
31
31
|
"@types/node": "^22.8.1",
|
|
32
32
|
"rsbuild-plugin-publint": "^0.3.4",
|
|
33
33
|
"typescript": "^5.8.2"
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
[
|
|
2
2
|
{
|
|
3
3
|
"text": "Guide",
|
|
4
|
-
"link": "/guide/",
|
|
4
|
+
"link": "/guide/start/introduction",
|
|
5
5
|
"activeMatch": "/guide/"
|
|
6
6
|
},
|
|
7
7
|
{
|
|
8
|
-
"text": "
|
|
9
|
-
"link": "/
|
|
10
|
-
"activeMatch": "/
|
|
8
|
+
"text": "API",
|
|
9
|
+
"link": "/api/",
|
|
10
|
+
"activeMatch": "/api/"
|
|
11
11
|
},
|
|
12
12
|
{
|
|
13
|
-
"text": "
|
|
14
|
-
"link": "https://rspress.rs/
|
|
13
|
+
"text": "Document",
|
|
14
|
+
"link": "https://rspress.rs/"
|
|
15
15
|
}
|
|
16
16
|
]
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
["index", "commands"]
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
["introduction", "getting-started"]
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
# Getting started
|
|
2
|
+
|
|
3
|
+
## Project structure
|
|
4
|
+
|
|
5
|
+
After creating a project with `create-rspress`, you will get the following project structure:
|
|
6
|
+
|
|
7
|
+
- `docs/` — The documentation source directory, configured via `root` in `rspress.config.ts`.
|
|
8
|
+
- `docs/_nav.json` — The navigation bar configuration.
|
|
9
|
+
- `docs/guide/_meta.json` — The sidebar configuration for the guide section.
|
|
10
|
+
- `docs/public/` — Static assets directory.
|
|
11
|
+
- `rspress.config.ts` — The Rspress configuration file.
|
|
12
|
+
|
|
13
|
+
## Development
|
|
14
|
+
|
|
15
|
+
Start the local development server:
|
|
16
|
+
|
|
17
|
+
```bash
|
|
18
|
+
npm run dev
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
:::tip
|
|
22
|
+
|
|
23
|
+
You can specify the port number or host with `--port` or `--host`, such as `rspress dev --port 8080 --host 0.0.0.0`.
|
|
24
|
+
|
|
25
|
+
:::
|
|
26
|
+
|
|
27
|
+
## Production build
|
|
28
|
+
|
|
29
|
+
Build the site for production:
|
|
30
|
+
|
|
31
|
+
```bash
|
|
32
|
+
npm run build
|
|
33
|
+
```
|
|
34
|
+
|
|
35
|
+
By default, Rspress will output to `doc_build` directory.
|
|
36
|
+
|
|
37
|
+
## Preview
|
|
38
|
+
|
|
39
|
+
Preview the production build locally:
|
|
40
|
+
|
|
41
|
+
```bash
|
|
42
|
+
npm run preview
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
## Next steps
|
|
46
|
+
|
|
47
|
+
- Learn how to use [MDX & React Components](/guide/use-mdx/components) in your docs.
|
|
48
|
+
- Learn about [Code Blocks](/guide/use-mdx/code-blocks/) syntax highlighting and line highlighting.
|
|
49
|
+
- Learn about [Custom Containers](/guide/use-mdx/container) for tips, warnings, and more.
|
|
50
|
+
- Explore the full [Rspress documentation](https://rspress.rs/) for advanced features.
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
# Introduction
|
|
2
|
+
|
|
3
|
+
Rspress is a static site generator based on [Rsbuild](https://rsbuild.rs/), rendered with the React framework. It comes with a default documentation theme, and you can quickly build a documentation site with Rspress.
|
|
4
|
+
|
|
5
|
+
## Why Rspress
|
|
6
|
+
|
|
7
|
+
- **Build Performance**. The core compilation module is based on the Rust front-end toolchain, providing millisecond-level startup and a more ultimate development experience.
|
|
8
|
+
- **AI-native**. Technical documentation not only serves human readers but can also be better understood and utilized by AI through SSG-MD.
|
|
9
|
+
- **MDX Support**. MDX is a powerful way to write content, allowing you to use React components in Markdown.
|
|
10
|
+
- **Basic Capabilities**. Including full-text search, internationalization, multi-version support, component library documentation, etc.
|
|
11
|
+
- **Extensibility**. Provides a built-in plugin system, supports extending Rspress through plugin API.
|
|
12
|
+
|
|
13
|
+
## Try Rspress
|
|
14
|
+
|
|
15
|
+
Go to [Getting Started](/guide/start/getting-started) to learn how to use Rspress to build a documentation site.
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
["components", { "type": "dir", "name": "code-blocks" }, "container"]
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
["title", "meta"]
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
# Code blocks
|
|
2
|
+
|
|
3
|
+
Rspress uses [Shiki](https://shiki.style) for syntax highlighting at compile time, which means better runtime performance.
|
|
4
|
+
|
|
5
|
+
When using code blocks in multiple languages, the corresponding language is automatically detected at compile time, and the runtime bundle size does not increase. For supported programming languages, refer to the [Shiki supported languages list](https://shiki.style/languages).
|
|
6
|
+
|
|
7
|
+
```js
|
|
8
|
+
console.log('Hello World');
|
|
9
|
+
```
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
# MDX & React components
|
|
2
|
+
|
|
3
|
+
Rspress supports not only Markdown but also [MDX](https://mdxjs.com/), a powerful way to develop content.
|
|
4
|
+
|
|
5
|
+
## Markdown
|
|
6
|
+
|
|
7
|
+
MDX is a superset of Markdown, which means you can write Markdown files as usual. For example:
|
|
8
|
+
|
|
9
|
+
```md
|
|
10
|
+
# Hello world
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
## Use components
|
|
14
|
+
|
|
15
|
+
When you want to use React components in Markdown files, you should name your files with `.mdx` extension.
|
|
16
|
+
|
|
17
|
+
```mdx
|
|
18
|
+
// docs/index.mdx
|
|
19
|
+
import { CustomComponent } from './custom';
|
|
20
|
+
|
|
21
|
+
# Hello world
|
|
22
|
+
|
|
23
|
+
<CustomComponent />
|
|
24
|
+
```
|
|
25
|
+
|
|
26
|
+
## Use Rspress built-in components
|
|
27
|
+
|
|
28
|
+
import { Tabs, Tab } from '@rspress/core/theme';
|
|
29
|
+
|
|
30
|
+
<Tabs>
|
|
31
|
+
|
|
32
|
+
<Tab label="foo.js">
|
|
33
|
+
|
|
34
|
+
```js
|
|
35
|
+
console.log('foo');
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
</Tab>
|
|
39
|
+
<Tab label="bar.js">
|
|
40
|
+
|
|
41
|
+
```js
|
|
42
|
+
console.log('bar');
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
</Tab>
|
|
46
|
+
|
|
47
|
+
</Tabs>
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
# Container
|
|
2
|
+
|
|
3
|
+
You can use the `:::` syntax to create custom containers and support custom titles.
|
|
4
|
+
|
|
5
|
+
## Examples
|
|
6
|
+
|
|
7
|
+
:::tip
|
|
8
|
+
This is a `block` of type `tip`
|
|
9
|
+
:::
|
|
10
|
+
|
|
11
|
+
:::info
|
|
12
|
+
This is a `block` of type `info`
|
|
13
|
+
:::
|
|
14
|
+
|
|
15
|
+
:::warning
|
|
16
|
+
This is a `block` of type `warning`
|
|
17
|
+
:::
|
|
18
|
+
|
|
19
|
+
:::danger
|
|
20
|
+
This is a `block` of type `danger`
|
|
21
|
+
:::
|
|
22
|
+
|
|
23
|
+
::: details
|
|
24
|
+
This is a `block` of type `details`
|
|
25
|
+
:::
|
|
26
|
+
|
|
27
|
+
:::tip Custom Title
|
|
28
|
+
This is a `block` of `Custom Title`
|
|
29
|
+
:::
|
|
30
|
+
|
|
31
|
+
:::tip{title="Custom Title"}
|
|
32
|
+
This is a `block` of `Custom Title`
|
|
33
|
+
:::
|
|
@@ -8,7 +8,7 @@ hero:
|
|
|
8
8
|
actions:
|
|
9
9
|
- theme: brand
|
|
10
10
|
text: Quick Start
|
|
11
|
-
link: /guide/
|
|
11
|
+
link: /guide/start/introduction
|
|
12
12
|
- theme: alt
|
|
13
13
|
text: GitHub
|
|
14
14
|
link: https://github.com/web-infra-dev/rspress
|
|
@@ -19,19 +19,25 @@ features:
|
|
|
19
19
|
- title: Blazing fast build speed
|
|
20
20
|
details: The core compilation module is based on the Rust front-end toolchain, providing a more ultimate development experience.
|
|
21
21
|
icon: 🏃🏻♀️
|
|
22
|
+
link: /guide/start/introduction
|
|
22
23
|
- title: Support for MDX content writing
|
|
23
24
|
details: MDX is a powerful way to write content, allowing you to use React components in Markdown.
|
|
24
25
|
icon: 📦
|
|
26
|
+
link: /guide/use-mdx/components
|
|
25
27
|
- title: Built-in full-text search
|
|
26
28
|
details: Automatically generates a full-text search index for you during construction, providing out-of-the-box full-text search capabilities.
|
|
27
29
|
icon: 🎨
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
30
|
+
link: https://rspress.rs/guide/advanced/custom-search
|
|
31
|
+
- title: AI-friendly
|
|
32
|
+
details: Generate llms.txt and Markdown files compliant with the llms.txt specification through SSG-MD, making it easier for large language models to understand and use your documentation.
|
|
33
|
+
icon: 🤖
|
|
34
|
+
link: https://rspress.rs/guide/basic/ssg-md
|
|
31
35
|
- title: Static site generation
|
|
32
36
|
details: In production, it automatically builds into static HTML files, which can be easily deployed anywhere.
|
|
33
37
|
icon: 🌈
|
|
38
|
+
link: https://rspress.rs/guide/basic/ssg
|
|
34
39
|
- title: Providing multiple custom capabilities
|
|
35
40
|
details: Through its extension mechanism, you can easily extend theme UI and build process.
|
|
36
41
|
icon: 🔥
|
|
42
|
+
link: https://rspress.rs/guide/basic/custom-theme
|
|
37
43
|
---
|
|
@@ -1,216 +0,0 @@
|
|
|
1
|
-
# Markdown & MDX
|
|
2
|
-
|
|
3
|
-
Rspress supports not only Markdown but also [MDX](https://mdxjs.com/), a powerful way to develop content.
|
|
4
|
-
|
|
5
|
-
## Markdown
|
|
6
|
-
|
|
7
|
-
MDX is a superset of Markdown, which means you can write Markdown files as usual. For example:
|
|
8
|
-
|
|
9
|
-
```md
|
|
10
|
-
# Hello world
|
|
11
|
-
```
|
|
12
|
-
|
|
13
|
-
## Use component
|
|
14
|
-
|
|
15
|
-
When you want to use React components in Markdown files, you should name your files with `.mdx` extension. For example:
|
|
16
|
-
|
|
17
|
-
```mdx
|
|
18
|
-
// docs/index.mdx
|
|
19
|
-
import { CustomComponent } from './custom';
|
|
20
|
-
|
|
21
|
-
# Hello world
|
|
22
|
-
|
|
23
|
-
<CustomComponent />
|
|
24
|
-
```
|
|
25
|
-
|
|
26
|
-
## Front matter
|
|
27
|
-
|
|
28
|
-
You can add Front Matter at the beginning of your Markdown file, which is a YAML-formatted object that defines some metadata. For example:
|
|
29
|
-
|
|
30
|
-
```yaml
|
|
31
|
-
---
|
|
32
|
-
title: Hello world
|
|
33
|
-
---
|
|
34
|
-
```
|
|
35
|
-
|
|
36
|
-
> Note: By default, Rspress uses h1 headings as html headings.
|
|
37
|
-
|
|
38
|
-
You can also access properties defined in Front Matter in the body, for example:
|
|
39
|
-
|
|
40
|
-
```markdown
|
|
41
|
-
---
|
|
42
|
-
title: Hello world
|
|
43
|
-
---
|
|
44
|
-
|
|
45
|
-
# {frontmatter.title}
|
|
46
|
-
```
|
|
47
|
-
|
|
48
|
-
The previously defined properties will be passed to the component as `frontmatter` properties. So the final output will be:
|
|
49
|
-
|
|
50
|
-
```html
|
|
51
|
-
<h1>Hello world</h1>
|
|
52
|
-
```
|
|
53
|
-
|
|
54
|
-
## Custom container
|
|
55
|
-
|
|
56
|
-
You can use the `:::` syntax to create custom containers and support custom titles. For example:
|
|
57
|
-
|
|
58
|
-
**Input:**
|
|
59
|
-
|
|
60
|
-
```markdown
|
|
61
|
-
:::tip
|
|
62
|
-
This is a `block` of type `tip`
|
|
63
|
-
:::
|
|
64
|
-
|
|
65
|
-
:::info
|
|
66
|
-
This is a `block` of type `info`
|
|
67
|
-
:::
|
|
68
|
-
|
|
69
|
-
:::warning
|
|
70
|
-
This is a `block` of type `warning`
|
|
71
|
-
:::
|
|
72
|
-
|
|
73
|
-
:::danger
|
|
74
|
-
This is a `block` of type `danger`
|
|
75
|
-
:::
|
|
76
|
-
|
|
77
|
-
::: details
|
|
78
|
-
This is a `block` of type `details`
|
|
79
|
-
:::
|
|
80
|
-
|
|
81
|
-
:::tip Custom Title
|
|
82
|
-
This is a `block` of `Custom Title`
|
|
83
|
-
:::
|
|
84
|
-
|
|
85
|
-
:::tip{title="Custom Title"}
|
|
86
|
-
This is a `block` of `Custom Title`
|
|
87
|
-
:::
|
|
88
|
-
```
|
|
89
|
-
|
|
90
|
-
**Output:**
|
|
91
|
-
|
|
92
|
-
:::tip
|
|
93
|
-
This is a `block` of type `tip`
|
|
94
|
-
:::
|
|
95
|
-
|
|
96
|
-
:::info
|
|
97
|
-
This is a `block` of type `info`
|
|
98
|
-
:::
|
|
99
|
-
|
|
100
|
-
:::warning
|
|
101
|
-
This is a `block` of type `warning`
|
|
102
|
-
:::
|
|
103
|
-
|
|
104
|
-
:::danger
|
|
105
|
-
This is a `block` of type `danger`
|
|
106
|
-
:::
|
|
107
|
-
|
|
108
|
-
::: details
|
|
109
|
-
This is a `block` of type `details`
|
|
110
|
-
:::
|
|
111
|
-
|
|
112
|
-
:::tip Custom Title
|
|
113
|
-
This is a `block` of `Custom Title`
|
|
114
|
-
:::
|
|
115
|
-
|
|
116
|
-
:::tip{title="Custom Title"}
|
|
117
|
-
This is a `block` of `Custom Title`
|
|
118
|
-
:::
|
|
119
|
-
|
|
120
|
-
## Code block
|
|
121
|
-
|
|
122
|
-
### Basic usage
|
|
123
|
-
|
|
124
|
-
You can use the \`\`\` syntax to create code blocks and support custom titles. For example:
|
|
125
|
-
|
|
126
|
-
**Input:**
|
|
127
|
-
|
|
128
|
-
````md
|
|
129
|
-
```js
|
|
130
|
-
console.log('Hello World');
|
|
131
|
-
```
|
|
132
|
-
|
|
133
|
-
```js title="hello.js"
|
|
134
|
-
console.log('Hello World');
|
|
135
|
-
```
|
|
136
|
-
````
|
|
137
|
-
|
|
138
|
-
**Output:**
|
|
139
|
-
|
|
140
|
-
```js
|
|
141
|
-
console.log('Hello World');
|
|
142
|
-
```
|
|
143
|
-
|
|
144
|
-
```js title="hello.js"
|
|
145
|
-
console.log('Hello World');
|
|
146
|
-
```
|
|
147
|
-
|
|
148
|
-
### Show line numbers
|
|
149
|
-
|
|
150
|
-
If you want to display line numbers, you can enable the `showLineNumbers` option in the config file:
|
|
151
|
-
|
|
152
|
-
```ts title="rspress.config.ts"
|
|
153
|
-
export default {
|
|
154
|
-
// ...
|
|
155
|
-
markdown: {
|
|
156
|
-
showLineNumbers: true,
|
|
157
|
-
},
|
|
158
|
-
};
|
|
159
|
-
```
|
|
160
|
-
|
|
161
|
-
### Wrap code
|
|
162
|
-
|
|
163
|
-
If you want to wrap long code line by default, you can enable the `defaultWrapCode` option in the config file:
|
|
164
|
-
|
|
165
|
-
```ts title="rspress.config.ts"
|
|
166
|
-
export default {
|
|
167
|
-
// ...
|
|
168
|
-
markdown: {
|
|
169
|
-
defaultWrapCode: true,
|
|
170
|
-
},
|
|
171
|
-
};
|
|
172
|
-
```
|
|
173
|
-
|
|
174
|
-
### Line highlighting
|
|
175
|
-
|
|
176
|
-
You can also apply line highlighting and code block title at the same time, for example:
|
|
177
|
-
|
|
178
|
-
**Input:**
|
|
179
|
-
|
|
180
|
-
````md
|
|
181
|
-
```js title="hello.js"
|
|
182
|
-
console.log('Hello World'); // [\!code highlight]
|
|
183
|
-
|
|
184
|
-
// [\!code highlight:3]
|
|
185
|
-
const a = 1;
|
|
186
|
-
|
|
187
|
-
console.log(a);
|
|
188
|
-
|
|
189
|
-
const b = 2;
|
|
190
|
-
|
|
191
|
-
console.log(b);
|
|
192
|
-
```
|
|
193
|
-
````
|
|
194
|
-
|
|
195
|
-
:::warning
|
|
196
|
-
The backslash (`\`) in `[\!code highlight]` is for Markdown escaping to display the raw syntax. Do not include it when using this notation in your actual code.
|
|
197
|
-
:::
|
|
198
|
-
|
|
199
|
-
**Output:**
|
|
200
|
-
|
|
201
|
-
```js title="hello.js"
|
|
202
|
-
console.log('Hello World'); // [!code highlight]
|
|
203
|
-
|
|
204
|
-
// [!code highlight:3]
|
|
205
|
-
const a = 1;
|
|
206
|
-
|
|
207
|
-
console.log(a);
|
|
208
|
-
|
|
209
|
-
const b = 2;
|
|
210
|
-
|
|
211
|
-
console.log(b);
|
|
212
|
-
```
|
|
213
|
-
|
|
214
|
-
## Rustify MDX compiler
|
|
215
|
-
|
|
216
|
-
You can enable Rustify MDX compiler by following config:
|