Saber-theme-vuepress NPM

saber-theme-vuepress

A Saber Port of the Default Vuepress Theme.

Install

yarn add saber-theme-vuepress

In your saber-config.yml:

theme: vuepress

This theme works best with following plugins:

saber-plugin-query-posts: Inject posts to homepage's page prop, generate tag pages

yarn add saber-plugin-query-posts markdown-it-div

plugins:
  - resolve: saber-plugin-query-posts

and markdown-it-div

markdown:
  plugins:
    - resolve: markdown-it-div

Layouts

home: Setup just like the Vuepress home page. All fields are populated from saber-config.yml.
post: For individual blog posts.
blog: A page to show all your posts.
page: For normal pages with a sidebar.
default: For any other pages without a sidebar.

Site Config

Configure site title, description etc in your saber-config.yml:

siteConfig:
  title: My Site
  description: About this website.
  author: My Name
  email: my@email.com

Theme Config

Navbar

Configure nav to show a set of links in header and optional repository link:

themeConfig:
  nav:
    - text: Home
      link: /
    - text: About
      link: /about.html
repo:
    - site: github
      name: your name

Home Page

Configure a home page at ./pages/index.md:

---
layout: home
heroImage: logo.jpg
heroTitle: Hello
heroDescription: Welcome to saber-theme-vuepress
actionText: Get Started →
actionLink: /about.html
features: 
  - title: Title One
    details: Details for title one.
  - title: Saber-Powered
    details: With Saber, static rendering with Vue.js is easier now than ever. 
  - title: Title Three
    details: Details for title three.
footer: Footer info goes here.
---