An opinionated blog starter template - statically generated with Vite and Vue 3.

Live Demo

Features

• ⚡ Built with Vue 3 and Vite 2

• 📑 Automatic routes based on pages and layouts

• 📦 Auto import components and icons

• 📃 Use markdown and Vue mixed together

• 🖋 Code syntax highlighting with Shiki

• 🎨 Styled with Tailwind CSS

• 💻 Pre-rendering pages with Vite SSG

• 📱 Installable with Offline support - PWA

• ☁️ Pre-configured Deployment scripts for GitHub Pages and Netlify

• 🕶 Dark theme support

Documentation

To get started 'Use this template' or fork the repository if you want to keep track of the updates on this repo.

Check out the live sample on Netlify or GitHub Pages for

• More information about the architecture
• A getting started guide
• Examples page

Developers

npm install to install the dependencies.

npm run dev to start a development server (with Vite).

npm run build to build a production-ready site, with server-side generated pages.

npm run serve to run the built site locally.

The choice is package manager is optional, yarn or pnpm can also be used instead of npm.

For development, the following VS Code extensions are recommended, but optional:

• Volar for Vue 3 language support
• Tailwind CSS IntelliSense for Tailwind CSS classes auto-completion
• Prettier for formatting
• ESLint for linting
• Iconify IntelliSense for SVG icon component auto-completion
• PostCSS Language Support for PostCSS syntax support

Future ideas

• Add a fuzzy search and tag search
  • Tags already exist on route object (parsed from meta keywords)
• Add KaTex support
• Add Mermaid Diagrams support
• Add vite-plugin-remote-assets
• Better animation support
  • Motion one
• Image optimization
• CLI to generate a new site easier
  • UI for creating a configuration
    • Names, titles, descriptions, colors, etc

Credits

• Yuxi (Evan) You for Vite and Vitepress, some of the markdown-it plugins are based on those found in Vitepress.
• Anthony Fu for Vitesse and Slidev, the template relies on a ton of the plugins found in Vitesse, and some of the features were inspired by Slidev.
• Everyone else whose libraries are used in this project ❤