chore: add docs

This commit is contained in:
zernonia 2023-08-30 09:28:05 +08:00
parent 71bff69c95
commit dd48dd8132
8 changed files with 187 additions and 2 deletions

View File

@ -0,0 +1,7 @@
import { defineConfig } from 'vitepress'
// https://vitepress.dev/reference/site-config
export default defineConfig({
title: "shadcn-vue",
description: "A VitePress Site"
})

View File

@ -0,0 +1,21 @@
<script setup lang="ts">
import { useData } from 'vitepress'
// https://vitepress.dev/reference/runtime-api#usedata
const { site, frontmatter } = useData()
</script>
<template>
<div v-if="frontmatter.home">
<h1>{{ site.title }}</h1>
<p>{{ site.description }}</p>
<ul>
<li><a href="/markdown-examples.html">Markdown Examples</a></li>
<li><a href="/api-examples.html">API Examples</a></li>
</ul>
</div>
<div v-else>
<a href="/">Home</a>
<Content />
</div>
</template>

View File

@ -0,0 +1,11 @@
// https://vitepress.dev/guide/custom-theme
import Layout from './Layout.vue'
import './style.css'
export default {
Layout,
enhanceApp({ app, router, siteData }) {
// ...
}
}

View File

@ -0,0 +1,5 @@
html {
font-family: Arial, Helvetica;
}

49
docs/api-examples.md Normal file
View File

@ -0,0 +1,49 @@
---
outline: deep
---
# Runtime API Examples
This page demonstrates usage of some of the runtime APIs provided by VitePress.
The main `useData()` API can be used to access site, theme, and page data for the current page. It works in both `.md` and `.vue` files:
```md
<script setup>
import { useData } from 'vitepress'
const { theme, page, frontmatter } = useData()
</script>
## Results
### Theme Data
<pre>{{ theme }}</pre>
### Page Data
<pre>{{ page }}</pre>
### Page Frontmatter
<pre>{{ frontmatter }}</pre>
```
<script setup>
import { useData } from 'vitepress'
const { site, theme, page, frontmatter } = useData()
</script>
## Results
### Theme Data
<pre>{{ theme }}</pre>
### Page Data
<pre>{{ page }}</pre>
### Page Frontmatter
<pre>{{ frontmatter }}</pre>
## More
Check out the documentation for the [full list of runtime APIs](https://vitepress.dev/reference/runtime-api#usedata).

4
docs/index.md Normal file
View File

@ -0,0 +1,4 @@
---
home: true
---

85
docs/markdown-examples.md Normal file
View File

@ -0,0 +1,85 @@
# Markdown Extension Examples
This page demonstrates some of the built-in markdown extensions provided by VitePress.
## Syntax Highlighting
VitePress provides Syntax Highlighting powered by [Shiki](https://github.com/shikijs/shiki), with additional features like line-highlighting:
**Input**
````
```js{4}
export default {
data () {
return {
msg: 'Highlighted!'
}
}
}
```
````
**Output**
```js{4}
export default {
data () {
return {
msg: 'Highlighted!'
}
}
}
```
## Custom Containers
**Input**
```md
::: info
This is an info box.
:::
::: tip
This is a tip.
:::
::: warning
This is a warning.
:::
::: danger
This is a dangerous warning.
:::
::: details
This is a details block.
:::
```
**Output**
::: info
This is an info box.
:::
::: tip
This is a tip.
:::
::: warning
This is a warning.
:::
::: danger
This is a dangerous warning.
:::
::: details
This is a details block.
:::
## More
Check out the documentation for the [full list of markdown extensions](https://vitepress.dev/guide/markdown).

View File

@ -11,7 +11,10 @@
"dev": "pnpm --filter www dev", "dev": "pnpm --filter www dev",
"prepare": "pnpm simple-git-hooks", "prepare": "pnpm simple-git-hooks",
"lint": "eslint . --ignore-path .gitignore", "lint": "eslint . --ignore-path .gitignore",
"lint:fix": "eslint . --fix --ignore-path .gitignore" "lint:fix": "eslint . --fix --ignore-path .gitignore",
"docs:dev": "vitepress dev docs",
"docs:build": "vitepress build docs",
"docs:preview": "vitepress preview docs"
}, },
"devDependencies": { "devDependencies": {
"@antfu/eslint-config": "^0.39.7", "@antfu/eslint-config": "^0.39.7",
@ -37,4 +40,4 @@
"lint-staged": { "lint-staged": {
"*": "eslint --fix" "*": "eslint --fix"
} }
} }