Vitepress

From the author

AutoGineer summary

Install

Documentation by Anthony Fu

Files

```js
export default {
  name: 'MyComponent'
}
```

```js{4}
export default {
  data() {
    return {
      msg: 'Highlighted!'  // Line 4 highlighted
    }
  }
}
```

```js{1,4,6-8}
// Line 1 highlighted
export default {
  data() {
    return {      // Line 4
      msg: 'Hi',
      foo: 'bar', // Lines 6-8
      baz: 'qux'
    }
  }
}
```

```js
export default {
  data() {
    return {
      msg: 'Highlighted!' // [!code highlight]
    }
  }
}
```

```js
export default {
  data() {
    return {
      msg: 'Focused!' // [!code focus]
    }
  }
}
```

// [!code focus:3]

```js
export default {
  data() {
    return {
      msg: 'Removed' // [!code --]
      msg: 'Added'   // [!code ++]
    }
  }
}
```

```js
export default {
  data() {
    return {
      msg: 'Error',   // [!code error]
      msg: 'Warning'  // [!code warning]
    }
  }
}
```

// .vitepress/config.ts
export default {
  markdown: {
    lineNumbers: true
  }
}

```ts:line-numbers
// Line numbers enabled
const a = 1
```

```ts:no-line-numbers
// Line numbers disabled
const b = 2
```

```ts:line-numbers=5
// Starts at line 5
const a = 1  // This is line 5
const b = 2  // This is line 6
```

::: code-group

```js [JavaScript]
export default { /* ... */ }
```

```ts [TypeScript]
export default defineConfig({ /* ... */ })
```

:::

<<< @/snippets/snippet.js

<<< @/snippets/snippet.js{2,4-6}

<<< @/snippets/snippet.js#regionName{1,2}

<<< @/snippets/snippet.cs{1,2,4-6 c#:line-numbers}

::: code-group

<<< @/snippets/config.js [JavaScript]
<<< @/snippets/config.ts [TypeScript]

:::

```js [vite.config.js]
export default defineConfig({})
```

Requirements and compatibility

Security

Related skills

• 

  Web Artifacts Builder

  AnthropicOfficial

  A structured workflow for developing and bundling complex, multi-component React artifacts for Claude.

  Software developmentClaude CodeClaude appsOpenAI Codex+14 more

  Apache-2.0Medium riskHas scriptsGitHub stars of the source repository188.6k
• 

  Frontend UI Engineering

  Addy Osmani· Community

  Engineering standards for building accessible, responsive, and production-ready frontend user interfaces.

  Software developmentClaude CodeClaude appsOpenAI Codex+14 more

  MITGitHub stars of the source repository113.9k
• 

  Anti UI Slop

  GitHubOfficial

  Prevent generic AI-generated UI by grounding interface development in real-world design patterns and rigorous review gates.

  Software developmentClaude CodeClaude appsOpenAI Codex+14 more

  Apache-2.0GitHub stars of the source repository40.9k
• 

  Ask Sonner

  Emil Kowalski· Community

  A comprehensive guide for implementing, styling, and troubleshooting the Sonner toast notification library in React applications.

  Software developmentClaude CodeClaude appsOpenAI Codex+14 more

  MITGitHub stars of the source repository54.3k
• 

  Pick UI Library

  Emil Kowalski· Community

  Get recommendations for frontend UI libraries based on a curated, opinionated list.

  Software developmentClaude CodeClaude appsOpenAI Codex+14 more

  MITGitHub stars of the source repository54.3k
• 

  Animate Expo

  Emil Kowalski· Community

  A senior mobile engineering guide for building React Native and Expo animations that feel correct on real devices.

  Software developmentClaude CodeClaude appsOpenAI Codex+14 more

  MITGitHub stars of the source repository54.3k

Download ZIP

The ZIP holds the skill’s files, its licence files and an ATTRIBUTION.md. Download vitepress.zip