新建项目,集成官方docs，初次提交
This commit is contained in:
2
content/1.getting-started/.navigation.yml
Normal file
2
content/1.getting-started/.navigation.yml
Normal file
@@ -0,0 +1,2 @@
|
||||
title: Getting Started
|
||||
icon: false
|
||||
86
content/1.getting-started/1.index.md
Normal file
86
content/1.getting-started/1.index.md
Normal file
@@ -0,0 +1,86 @@
|
||||
---
|
||||
title: Introduction
|
||||
description: Welcome to Nuxt UI Pro documentation template.
|
||||
navigation:
|
||||
icon: i-lucide-house
|
||||
---
|
||||
|
||||
This template is a ready-to-use documentation template made with [Nuxt UI Pro](https://ui.nuxt.com/pro), a collection of premium components built on top of [Nuxt UI](https://ui.nuxt.com) to create beautiful & responsive Nuxt applications in minutes.
|
||||
|
||||
There are already many websites based on this template:
|
||||
|
||||
::card-group
|
||||
:::card
|
||||
---
|
||||
icon: i-simple-icons-nuxtdotjs
|
||||
target: _blank
|
||||
title: Nuxt
|
||||
to: https://nuxt.com
|
||||
---
|
||||
The Nuxt website
|
||||
:::
|
||||
|
||||
:::card
|
||||
---
|
||||
icon: i-simple-icons-nuxtdotjs
|
||||
target: _blank
|
||||
title: Nuxt UI
|
||||
to: https://ui.nuxt.com
|
||||
---
|
||||
The documentation of `@nuxt/ui` and `@nuxt/ui-pro`
|
||||
:::
|
||||
|
||||
:::card
|
||||
---
|
||||
icon: i-simple-icons-nuxtdotjs
|
||||
target: _blank
|
||||
title: Nuxt Image
|
||||
to: https://image.nuxt.com
|
||||
---
|
||||
The documentation of `@nuxt/image`
|
||||
:::
|
||||
|
||||
:::card
|
||||
---
|
||||
icon: i-simple-icons-nuxtdotjs
|
||||
target: _blank
|
||||
title: Nuxt Content
|
||||
to: https://content.nuxt.com
|
||||
---
|
||||
The documentation of `@nuxt/content`
|
||||
:::
|
||||
|
||||
:::card
|
||||
---
|
||||
icon: i-simple-icons-nuxtdotjs
|
||||
target: _blank
|
||||
title: Nuxt Devtools
|
||||
to: https://devtools.nuxt.com
|
||||
---
|
||||
The documentation of `@nuxt/devtools`
|
||||
:::
|
||||
|
||||
:::card
|
||||
---
|
||||
icon: i-simple-icons-nuxtdotjs
|
||||
target: _blank
|
||||
title: Nuxt Hub
|
||||
to: https://hub.nuxt.com
|
||||
---
|
||||
The best place to manage your projects, environments and variables.
|
||||
:::
|
||||
::
|
||||
|
||||
## Key Features
|
||||
|
||||
This template includes a range of features designed to streamline documentation management:
|
||||
|
||||
- **Powered by** [**Nuxt 3**](https://nuxt.com): Utilizes the latest Nuxt framework for optimal performance.
|
||||
- **Built with** [**Nuxt UI**](https://ui.nuxt.com) **and** [**Nuxt UI Pro**](https://ui.nuxt.com/pro): Integrates a comprehensive suite of UI components.
|
||||
- [**MDC Syntax**](https://content.nuxt.com/usage/markdown) **via** [**Nuxt Content**](https://content.nuxt.com): Supports Markdown with component integration for dynamic content.
|
||||
- [**Nuxt Studio**](https://content.nuxt.com/docs/studio) **Compatible**: Offers integration with Nuxt Studio for content editing.
|
||||
- **Auto-generated Sidebar Navigation**: Automatically generates navigation from content structure.
|
||||
- **Full-Text Search**: Includes built-in search functionality for content discovery.
|
||||
- **Optimized Typography**: Features refined typography for enhanced readability.
|
||||
- **Dark Mode**: Offers dark mode support for user preference.
|
||||
- **Extensive Functionality**: Explore the template to fully appreciate its capabilities.
|
||||
29
content/1.getting-started/2.installation.md
Normal file
29
content/1.getting-started/2.installation.md
Normal file
@@ -0,0 +1,29 @@
|
||||
---
|
||||
title: Installation
|
||||
description: Get started with Nuxt UI Pro documentation template.
|
||||
navigation:
|
||||
icon: i-lucide-download
|
||||
---
|
||||
|
||||
::tip{target="_blank" to="https://content.nuxt.com/templates/docs"}
|
||||
Use this template on Nuxt Studio and start your documentation in seconds.
|
||||
::
|
||||
|
||||
## Quick Start
|
||||
|
||||
You can start a fresh new project with:
|
||||
|
||||
```bash [Terminal]
|
||||
npx nuxi init -t github:nuxt-ui-pro/docs
|
||||
```
|
||||
|
||||
or create a new repository from GitHub:
|
||||
|
||||
1. Open <https://github.com/nuxt-ui-pro/docs>
|
||||
2. Click on `Use this template` button
|
||||
3. Enter repository name and click on `Create repository from template` button
|
||||
4. Clone your new repository
|
||||
5. Install dependencies with your favorite package manager
|
||||
6. Start development server
|
||||
|
||||
That's it! You can now start writing your documentation in the [`content/`](https://content.nuxt.com/usage/content-directory) directory 🚀
|
||||
127
content/1.getting-started/3.usage.md
Normal file
127
content/1.getting-started/3.usage.md
Normal file
@@ -0,0 +1,127 @@
|
||||
---
|
||||
title: Usage
|
||||
description: Learn how to write and customize your documentation.
|
||||
navigation:
|
||||
icon: i-lucide-sliders
|
||||
---
|
||||
|
||||
This is only a basic example of what you can achieve with [Nuxt UI Pro](https://ui.nuxt.com/pro/guide), you can tweak it to match your needs. The template uses several Nuxt modules underneath like [`@nuxt/content`](https://content.nuxt.com) for the content and [`nuxt-og-image`](https://nuxtseo.com/og-image/getting-started/installation) for social previews.
|
||||
|
||||
::tip
|
||||
---
|
||||
target: _blank
|
||||
to: https://ui.nuxt.com/getting-started/installation/pro/nuxt
|
||||
---
|
||||
Learn more on how to take the most out of Nuxt UI Pro!
|
||||
::
|
||||
|
||||
## Writing content
|
||||
|
||||
You can just start writing `.md` or `.yml` files in the [`content/`](https://content.nuxt.com/usage/content-directory) directory to have your pages updated. The navigation will be automatically generated in the left aside and in the mobile menu. You will also be able to go through your content with full-text search.
|
||||
|
||||
## App Configuration
|
||||
|
||||
In addition to `@nuxt/ui-pro` configuration through the `app.config.ts`, this template lets you customize the `Header`, `Footer` and the `Table of contents` components.
|
||||
|
||||
### Header
|
||||
|
||||
```ts [app.config.ts]
|
||||
export default defineAppConfig({
|
||||
header: {
|
||||
title: '',
|
||||
to: '/',
|
||||
// Logo configuration
|
||||
logo: {
|
||||
alt: '',
|
||||
// Light mode
|
||||
light: '',
|
||||
// Dark mode
|
||||
dark: ''
|
||||
},
|
||||
// Show or hide the search bar
|
||||
search: true,
|
||||
// Show or hide the color mode button
|
||||
colorMode: true,
|
||||
// Customize links
|
||||
links: [{
|
||||
'icon': 'i-simple-icons-github',
|
||||
'to': 'https://github.com/nuxt-ui-pro/docs',
|
||||
'target': '_blank',
|
||||
'aria-label': 'GitHub'
|
||||
}]
|
||||
},
|
||||
})
|
||||
```
|
||||
|
||||
### Footer
|
||||
|
||||
```ts [app.config.ts]
|
||||
export default defineAppConfig({
|
||||
footer: {
|
||||
// Update bottom left credits
|
||||
credits: `Copyright © ${new Date().getFullYear()}`,
|
||||
// Show or hide the color mode button
|
||||
colorMode: false,
|
||||
// Customize links
|
||||
links: [{
|
||||
'icon': 'i-simple-icons-nuxtdotjs',
|
||||
'to': 'https://nuxt.com',
|
||||
'target': '_blank',
|
||||
'aria-label': 'Nuxt Website'
|
||||
}, {
|
||||
'icon': 'i-simple-icons-discord',
|
||||
'to': 'https://discord.com/invite/ps2h6QT',
|
||||
'target': '_blank',
|
||||
'aria-label': 'Nuxt UI on Discord'
|
||||
}, {
|
||||
'icon': 'i-simple-icons-x',
|
||||
'to': 'https://x.com/nuxt_js',
|
||||
'target': '_blank',
|
||||
'aria-label': 'Nuxt on X'
|
||||
}, {
|
||||
'icon': 'i-simple-icons-github',
|
||||
'to': 'https://github.com/nuxt/ui',
|
||||
'target': '_blank',
|
||||
'aria-label': 'Nuxt UI on GitHub'
|
||||
}]
|
||||
},
|
||||
})
|
||||
```
|
||||
|
||||
### Table of contents
|
||||
|
||||
```ts [app.config.ts]
|
||||
export default defineAppConfig({
|
||||
toc: {
|
||||
// Title of the main table of contents
|
||||
title: 'Table of Contents',
|
||||
// Customize links
|
||||
bottom: {
|
||||
// Title of the bottom table of contents
|
||||
title: 'Community',
|
||||
// URL of your repository content folder
|
||||
edit: 'https://github.com/nuxt-ui-pro/docs/edit/main/content',
|
||||
links: [{
|
||||
icon: 'i-lucide-star',
|
||||
label: 'Star on GitHub',
|
||||
to: 'https://github.com/nuxt/ui',
|
||||
target: '_blank'
|
||||
}, {
|
||||
icon: 'i-lucide-book-open',
|
||||
label: 'Nuxt UI Pro docs',
|
||||
to: 'https://ui.nuxt.com/getting-started/installation/pro/nuxt',
|
||||
target: '_blank'
|
||||
}, {
|
||||
icon: 'i-simple-icons-nuxtdotjs',
|
||||
label: 'Purchase a license',
|
||||
to: 'https://ui.nuxt.com/pro/purchase',
|
||||
target: '_blank'
|
||||
}]
|
||||
}
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
::tip{target="_blank" to="https://content.nuxt.com/docs/studio/config"}
|
||||
This template integrates with Nuxt Studio, providing a visual interface for editing your documentation - perfect for non-technical contributors.
|
||||
::
|
||||
Reference in New Issue
Block a user