Skip to content

Commit 9f19423

Browse files
authored
docs: apply studio parsing
1 parent c3f2b9b commit 9f19423

30 files changed

+694
-593
lines changed

docs/content/docs/1.getting-started/1.index.md

+4-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
---
2-
navigation.title: Introduction
2+
navigation:
3+
title: Introduction
34
title: Nuxt Content v3
45
description: The powerful Git-based CMS designed specifically for Nuxt developers.
56
---
@@ -35,11 +36,11 @@ Benefits include:
3536

3637
The new collections system provides automatic TypeScript types for all your data. Every utility and API is strongly typed based on your collection definitions, ensuring robust type safety throughout development.
3738

38-
### Nuxt Studio Integration :badge[Soon]{color=neutral}
39+
### Nuxt Studio Integration :badge[Soon]{color="neutral"}
3940

4041
[Nuxt Studio](/docs/studio/setup) and v3 are designed to complement each other perfectly.. The [studio module](https://github.com/nuxtlabs/studio-module) is now integrated directly into Nuxt Content, creating an ideal environment where developers can focus on code while team members manage content through an intuitive interface.
4142

42-
:hr
43+
---
4344

4445
We're excited for you to explore these new capabilities. Dive into our documentation to learn more about integrating the module and implementing best practices in your next project.
4546

docs/content/docs/1.getting-started/2.installation.md

+1-4
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,13 @@
11
---
22
title: Installation
3-
description: 'Get started with Nuxt Content v3 in your Nuxt application.'
3+
description: Get started with Nuxt Content v3 in your Nuxt application.
44
---
55

66
### Install the Package
77

88
Choose your preferred package manager to install Nuxt Content v3:
99

1010
::code-group
11-
1211
```bash [pnpm]
1312
pnpm add @nuxt/content@next
1413
```
@@ -24,7 +23,6 @@ npm install @nuxt/content@next
2423
```bash [bun]
2524
bun add @nuxt/content@next
2625
```
27-
2826
::
2927

3028
### Register the Module
@@ -97,4 +95,3 @@ useSeoMeta({
9795
::tip{icon="i-lucide-rocket"}
9896
That's it! You've now created your first Nuxt Content page.
9997
::
100-

docs/content/docs/1.getting-started/3.configuration.md

+25-17
Original file line numberDiff line numberDiff line change
@@ -21,8 +21,7 @@ Nuxt Content read and parse all the available contents at built time. This optio
2121

2222
Configure markdown parser.
2323

24-
#### `toc`
25-
24+
#### `toc`
2625

2726
::code-group
2827
```ts [Default]
@@ -31,6 +30,7 @@ toc: {
3130
searchDepth: 2
3231
}
3332
```
33+
3434
```ts [Signature]
3535
type Toc = {
3636
depth: number
@@ -42,6 +42,7 @@ type Toc = {
4242
Control behavior of Table of Contents generation.
4343
4444
Value:
45+
4546
- `depth`: Maximum heading depth to include in the table of contents.
4647
- `searchDepth`: Maximum depth of nested tags to search for heading.
4748
@@ -65,6 +66,7 @@ export default defineNuxtConfig({
6566
```ts [Default]
6667
remarkPlugins: {}
6768
```
69+
6870
```ts [Signature]
6971
type RemarkPlugins = Record<string, false | MarkdownPlugin>
7072
```
@@ -102,6 +104,7 @@ export default defineNuxtConfig({
102104
```ts [Default]
103105
rehypePlugins: {}
104106
```
107+
105108
```ts [Signature]
106109
type RehypePlugins = object
107110
```
@@ -132,17 +135,19 @@ export default defineNuxtConfig({
132135
```ts [Default]
133136
highlight: false
134137
```
138+
135139
```ts [Signature]
136140
type Highlight = false | object
137141
```
138142
::
139143
140144
Nuxt Content uses [Shiki](https://github.com/shikijs/shiki) to provide syntax highlighting for [`ProsePre`](/docs/components/prose#prosepre) and [`ProseCode`](/docs/components/prose#prosecode).
141145
142-
| Option | Type | Description |
143-
| --------- | :------------------------------------------: | :------------------------------------------------------------------------------------------------------------------ |
144-
| `theme` | `ShikiTheme` or `Record<string, ShikiTheme>` | The [color theme](https://github.com/shikijs/shiki/blob/main/docs/themes.md) to use. |
145-
| `langs` | `ShikiLang[]` | The [loaded languages](https://github.com/shikijs/shiki/blob/main/docs/languages.md) available for highlighting. |
146+
| | | |
147+
| ------- | -------------------------------------------- | ---------------------------------------------------------------------------------------------------------------- |
148+
| Option | Type | Description |
149+
| `theme` | `ShikiTheme` or `Record<string, ShikiTheme>` | The [color theme](https://github.com/shikijs/shiki/blob/main/docs/themes.md) to use. |
150+
| `langs` | `ShikiLang[]` | The [loaded languages](https://github.com/shikijs/shiki/blob/main/docs/languages.md) available for highlighting. |
146151
147152
- `highlight.theme`
148153
@@ -291,7 +296,7 @@ export default defineNuxtConfig({
291296

292297
### `LibSQL`
293298

294-
If you plan to deploy your application using LibSQL database you need to use `libsql` database adapter.
299+
If you plan to deploy your application using LibSQL database you need to use `libsql` database adapter.
295300

296301
First, make sure to install the `@libsql/client` package:
297302

@@ -327,31 +332,33 @@ Configure content renderer.
327332
```ts [Default]
328333
{ h2: true, h3: true, h4: true }
329334
```
335+
330336
```ts [Signature]
331337
type AnchorLinks = boolean | Record<'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6', boolean>
332338
```
333339
::
334340
335-
336341
Control anchor link generation, by default it generates anchor links for `h2`, `h3` and `h4` heading
337342
338343
Value:
344+
339345
- `false`: will disable link generation.
340346
- `true`: will enable link generation for all headings.
341347
- `object`: will customize the link generation.
342-
- `h1: boolean`{lang=ts}: Whether render anchor link for `H1` tags or not.
343-
- `h2: boolean`{lang=ts}: Whether render anchor link for `H2` tags or not.
344-
- `h3: boolean`{lang=ts}: Whether render anchor link for `H3` tags or not.
345-
- `h4: boolean`{lang=ts}: Whether render anchor link for `H4` tags or not.
346-
- `h5: boolean`{lang=ts}: Whether render anchor link for `H5` tags or not.
347-
- `h6: boolean`{lang=ts}: Whether render anchor link for `H6` tags or not.
348+
- `h1: boolean`: Whether render anchor link for `H1` tags or not.
349+
- `h2: boolean`: Whether render anchor link for `H2` tags or not.
350+
- `h3: boolean`: Whether render anchor link for `H3` tags or not.
351+
- `h4: boolean`: Whether render anchor link for `H4` tags or not.
352+
- `h5: boolean`: Whether render anchor link for `H5` tags or not.
353+
- `h6: boolean`: Whether render anchor link for `H6` tags or not.
348354
349355
### `alias`
350356
351357
::code-group
352358
```ts [Default]
353359
alias: {}
354360
```
361+
355362
```ts [Signature]
356363
type Alias = Record<string, string>
357364
```
@@ -383,9 +390,10 @@ watch: {
383390
Configure content hot reload in development.
384391

385392
Value:
386-
- `enabled`{lang=ts}: Enable/Disable hot reload.
387-
- `port`{lang=ts}: Select the port used for the WebSocket server.
388-
- `showURL`{lang=ts}: Toggle URL display in dev server boot message.
393+
394+
- `enabled`: Enable/Disable hot reload.
395+
- `port`: Select the port used for the WebSocket server.
396+
- `showURL`: Toggle URL display in dev server boot message.
389397

390398
::callout
391399
The watcher is a development feature and will not be included in production.

docs/content/docs/1.getting-started/4.migration.md

+8-12
Original file line numberDiff line numberDiff line change
@@ -3,37 +3,35 @@ title: Migration
33
description: How to migrate from v2 to v3
44
---
55

6-
Nuxt Content v3 had been rebuilt from the ground up, resulting in a new library with enhanced capabilities. While we've redesigned concepts and components in a similar way as Content v2, breaking changes are inevitable.
6+
Nuxt Content v3 had been rebuilt from the ground up, resulting in a new library with enhanced capabilities. While we've redesigned concepts and components in a similar way as Content v2, breaking changes are inevitable.
77

88
Don't worry, you don't need to modify your content files, We made sure that Content v3 handles content in the same way as Content v2.
99

1010
## Changes
1111

1212
Here is the list of breaking changes in Content v3:
1313

14-
- `queryContent()`{lang=ts} API is replaced with new `queryCollection()`{lang=ts}
14+
- `queryContent()` API is replaced with new `queryCollection()`
1515
- New API is backed by SQL
1616
- New API search contents within the specific collection
17-
- `fetchContentNavigation()`{lang=ts} API is replaced with new `queryCollectionNavigation()`{lang=ts}
18-
- Surroundings now has its own separate API `queryCollectionItemSurroundings()`{lang=ts}
17+
- `fetchContentNavigation()` API is replaced with new `queryCollectionNavigation()`
18+
- Surroundings now has its own separate API `queryCollectionItemSurroundings()`
1919
- Document driven mode is fully dropped, meaning:
2020
- Markdown files will not convert to Nuxt pages automatically, you need to create pages, see [how](/docs/components/content-renderer#example)
21-
- `useContent()`{lang=ts} composable is removed
21+
- `useContent()` composable is removed
2222
- We simplified rendering components.
2323
- `<ContentDoc>`, `<ContentList>`, `<ContentNavigation>` and `<ContentQuery>` components are dropped in v3.
2424
- `_dir.yml` files are renamed to `.navigation.yml`
2525
- Multi source is dropped in favor of multi collection.
2626
- Document `._path` is now renamed to `.path`
27-
- `searchContent()`{lang=ts} is dropped in favor of new api `queryCollectionSearchSections`
27+
- `searchContent()` is dropped in favor of new api `queryCollectionSearchSections`
2828
- Full text search can easily be done using this API See [Full-Text Search Snippets](/docs/advanced/fulltext-search)
29-
- `useContentHelpers()`{lang=ts} is removed
30-
29+
- `useContentHelpers()` is removed
3130

3231
## Implement Document Driven mode in v3
3332

3433
Implementing document driven mode is Content v3 is quite easy. All you need is to create a catch-all page in Nuxt and fetch contents based on route path.
3534

36-
3735
```vue [pages/[...slug\\].vue]
3836
<script lang="ts" setup>
3937
const route = useRoute()
@@ -67,7 +65,6 @@ const v2Query = await queryContent(route.path).findOne()
6765
const v3Query = await queryCollection('content').path(route.path).first()
6866
```
6967

70-
7168
```ts [Find contents with custom filter]
7269
// Content v2
7370
const v2Query = await queryContent()
@@ -79,8 +76,7 @@ const v3Query = await queryCollection('content')
7976
.first()
8077
```
8178

82-
83-
## Convert `queryContent().findSurround()`{lang=ts}
79+
## Convert `queryContent().findSurround()`
8480

8581
Surround now has it's own separate API.
8682

docs/content/docs/2.collections/1.collections.md

+2-3
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,17 @@
22
title: Define Content Collections
33
navigation:
44
title: Define
5-
description: 'Learn how to define and configure content collections in your Nuxt application.'
5+
description: Learn how to define and configure content collections in your Nuxt application.
66
---
77

8-
The Nuxt Content module automatically parses any content files within the `content/` directory located at the root of your Nuxt application. This setup allows you to freely structure the folder to suit your project's needs.
8+
The Nuxt Content module automatically parses any content files within the `content/` directory located at the root of your Nuxt application. This setup allows you to freely structure the folder to suit your project's needs.
99

1010
For better organization, consider using Content Collections, which let you categorize and manage content more effectively. These collections are defined in a `content.config.ts` file.
1111

1212
::warning
1313
If no `content.config.ts` file is present, all files within the content folder are parsed and imported by default. However, once a config file is added, only files matching the specified path patterns defined in collections will be imported.
1414
::
1515

16-
1716
## What are Content Collections?
1817

1918
Content Collections organize related items within your Nuxt Content project. They provide a structured way to manage your content, making it easier to query, display, and maintain your site's data.

docs/content/docs/2.collections/2.types.md

+8-7
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ defineCollection({
2424
```
2525

2626
::tip
27-
Use the **page** type if there is a 1-to-1 relationship between content files and pages on your site.
27+
Use the **page** type if there is a 1-to-1 relationship between content files and pages on your site.
2828
::
2929

3030
### Path generation
@@ -33,16 +33,17 @@ Nuxt Content will automatically generate a path for each file in the collection,
3333

3434
Here are examples of generated paths based on file structure:
3535

36-
| File | Path |
37-
| -------------------------------- | :-------------------- |
36+
| | |
37+
| -------------------------------- | --------------------- |
38+
| File | Path |
3839
| `content/index.md` | `/` |
3940
| `content/about.md` | `/about` |
4041
| `content/blog/index.md` | `/blog` |
4142
| `content/blog/hello.md` | `/blog/hello` |
4243
| `content/1.guide/2.installation` | `/guide/installation` |
4344

4445
::note
45-
You can use the helper [`queryCollection('COLLECTION').path('PATH')`{lang=ts}](/docs/utils/query-collection) to retrieve content by a specific path.
46+
You can use the helper [`queryCollection('COLLECTION').path('PATH')`](/docs/utils/query-collection) to retrieve content by a specific path.
4647
::
4748

4849
### Schema Overrides
@@ -57,6 +58,7 @@ When you use the **page** type, Nuxt Content generates several standard fields t
5758
- `navigation`: Page navigation configuration (for [queryCollectionNavigation](/docs/utils/query-collection-navigation))
5859

5960
Here is the corresponding schema applied:
61+
6062
```ts
6163
path: z.string(),
6264
title: z.string(),
@@ -103,14 +105,14 @@ The data type is useful for content that doesn’t directly correspond to a webp
103105
With data collections, you have complete control over the schema, allowing you to define custom structures.
104106

105107
::note
106-
There’s no strict relationship between collection type and file extension. For instance, a **page** collection can use [Markdown](/docs/files/markdown) or [YAML](/docs/files/yaml) or [JSON](/docs/files/json) files, and **data** collections can use any of these formats as well.
108+
There’s no strict relationship between collection type and file extension. For instance, a **page** collection can use [Markdown](/docs/files/markdown) or [YAML](/docs/files/yaml) or [JSON](/docs/files/json) files, and **data** collections can use any of these formats as well.
107109
::
108110

109111
## Ordering Files
110112

111113
For both types, you may want to control the display order in lists. Use numeric prefixes in file and directory names to specify an order. Nuxt Content will use these numbers when ordering content lists.
112114

113-
``` [Directory structure]
115+
```text [Directory structure]
114116
content/
115117
1.frameworks/
116118
1.vue.md
@@ -125,4 +127,3 @@ content/
125127
::warning
126128
Separate number from file name using `.` character. Using any other separator will not work.
127129
::
128-

docs/content/docs/2.collections/3.sources.md

+3-2
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ export const collections = {
2323
The `source` property can be defined as either a string (following a glob pattern) or an object, allowing more detailed source configuration for your target directory and files within the content folder.
2424

2525
**Example:**
26+
2627
- `source: '**` includes all files within the content directory and its subdirectories.
2728
- `source: '**/*.md'`includes all `Markdown` files within the content directory and its subdirectories.
2829
- `source: 'docs/**/*.yml'` includes all `YML` files within the `content/docs` and its subdirectories.
@@ -41,15 +42,15 @@ Glob patterns to exclude content from the import.
4142

4243
This configuration only applied for **page** type with 1-to-1 relationship between content files and pages on your site.
4344

44-
It represents the path prefix (base URL) of the corresponding page on the website.
45+
It represents the path prefix (base URL) of the corresponding page on the website.
4546

4647
### `cwd`
4748

4849
Root directory for content matching.
4950

5051
### `repository`
5152

52-
External source representing a remote git repository URL (e.g., https://github.com/nuxt/content)
53+
External source representing a remote git repository URL (e.g., <https://github.com/nuxt/content>)
5354

5455
### `authToken`
5556

0 commit comments

Comments
 (0)