Getting Started

Prerequisites

Manual Installation

This section will help you build a basic VuePress documentation site from ground up. If you already have an existing project and would like to keep documentation inside the project, start from Step 3.

  • Step 1: Create and change into a new directory
  1. mkdir vuepress-starter
  2. cd vuepress-starter
  • Step 2: Initialize your project

  • YARN

  • NPM
  1. git init
  2. yarn init
  1. git init
  2. npm init
  • Step 3: Install VuePress locally

  • YARN

  • NPM
  1. yarn add -D vuepress@next
  1. npm install -D vuepress@next
  1. {
  2. "scripts": {
  3. "docs:dev": "vuepress dev docs",
  4. "docs:build": "vuepress build docs"
  5. }
  6. }
  • Step 5: Add the default temp and cache directory to .gitignore file
  1. echo 'node_modules\n.temp\n.cache' >> .gitignore
  • Step 6: Create your first document
  1. mkdir docs
  2. echo '# Hello VuePress' > docs/README.md
  • Step 7: Serve the documentation site in the local server

  • YARN

  • NPM
  1. yarn docs:dev
  1. npm run docs:dev

VuePress will start a hot-reloading development server at http://localhost:8080Getting Started - 图4open in new window. When you modify your markdown files, the content in the browser will be auto updated.

By now, you should have a basic but functional VuePress documentation site. Next, learn about the basics of configuration in VuePress.