VuePress 初體驗 | 點燈坊

VuePress 2 已經採用 Vue 3 與 Vite，是值得期待的 SSG。

Version

VuePress 2.0.0-beta.18

VuePress Project

$ mkdir vuepress-lab
$ cd vuepress-lab
$ yarn add --dev vuepress@next

使用 Yarn 安裝 VuePress 2。

NPM Script

package.json

{
  "scripts": {
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs"
  },
  "devDependencies": {
    "vuepress": "^2.0.0-beta.18"
  }
}

• docs:dev：使用 Dev Server 執行 VuePress
• docs:build：將 markdown 編譯成 HTML/CSS/JavaScript

Git Ignore

.gitignore

node_modules
.temp
.cache
.idea

將 node_modules、.temp 、 .cache 與 .idea 四個目錄排除於 Git。

Markdown

docs/index.md

# Hello VuePress

建立第一個 markdown 於 docs 目錄下。

Dev Server

$ yarn docs:dev

啟動 Dev Server 於 http://localhost:8080/。

VuePress 成功啟動。

Conclusion

• VuePress 2 尚未提供 CLI，必須手動建立 VuePress project

Reference

VuePress, Getting Started