Frontend Development 9 min read

Building a Knowledge Management Site with VuePress: From Installation to Automated Cloud Deployment

This guide walks developers through selecting VuePress for a centralized documentation portal, installing it globally or locally, configuring navigation and build scripts, generating static files, deploying them on an Ubuntu server with Nginx, and automating updates via Jenkins, cron jobs, and Docker.

Wukong Talks Architecture
Wukong Talks Architecture
Wukong Talks Architecture
Building a Knowledge Management Site with VuePress: From Installation to Automated Cloud Deployment

The article begins by identifying common pain points for developers who struggle to locate and share internal documentation, and proposes a web‑based knowledge‑management portal built with VuePress, which leverages Markdown for authoring and Git for version control.

After evaluating alternatives such as enterprise note‑taking tools and GitBook, VuePress is chosen for its lightweight theme system and seamless integration with Vue.

Installation options are presented:

Global installation: yarn global add vuepress or npm install -g vuepress

Local installation for existing projects: yarn add -D vuepress or npm install -D vuepress , then create a docs folder and a README.md file.

Project scripts are added to package.json :

{
  "scripts": {
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs"
  }
}

Running yarn docs:dev (or npm run docs:dev ) starts a development server on port 8080, while yarn docs:build generates static files in .vuepress/dist , which can be relocated via the dest field in .vuepress/config.js .

To serve the site, an Nginx configuration is created on an Ubuntu server:

server {
  listen       8002;
  server_name  birddoc.com;
  location / {
    root   /home/user/project/github/BirdDoc/public;
    index  index.html index.htm;
    try_files $uri $uri/ =404;
  }
}

After restarting Nginx and updating /etc/hosts , the site is accessible at http://birddoc.com:8002/ .

For automated deployment, the article outlines several approaches:

Jenkins pipeline triggered by GitHub webhooks.

Cron‑based build script ( /home/job/build.sh ) that pulls the latest code, runs npm run build , and logs timestamps.

Docker containerization (planned for future work).

Each method includes sample shell snippets and configuration files to illustrate the full CI/CD workflow.

Overall, the guide provides a step‑by‑step, code‑rich tutorial for turning a VuePress project into a searchable, searchable documentation site and continuously deploying it to a cloud server.

CI/CDDeploymentdocumentationnginxnodejsVuePressStatic Site
Wukong Talks Architecture
Written by

Wukong Talks Architecture

Explaining distributed systems and architecture through stories. Author of the "JVM Performance Tuning in Practice" column, open-source author of "Spring Cloud in Practice PassJava", and independently developed a PMP practice quiz mini-program.

0 followers
Reader feedback

How this landed with the community

login Sign in to like

Rate this article

Was this worth your time?

Sign in to rate
Discussion

0 Comments

Thoughtful readers leave field notes, pushback, and hard-won operational detail here.