vuepress web app

靜晴軒別苑

採用VuePress 構建的Web 應用程序：https://nice.lovejade.cn

目標與哲學

靜晴軒別苑的誕生，其初衷完全是為了體驗VuePress : Vue 驅動的靜態網站生成器。 VuePress 由兩部分組成：一部分是支持用Vue開發主題的極簡靜態網站生成器，另一個部分是為書寫技術文檔而優化的默認主題。它的誕生初衷是為了支持Vue及其子項目的文檔需求。

每一個由VuePress生成的頁面都帶有預渲染好的HTML，也因此具有非常好的加載性能和搜索引擎優化（ SEO ）。同時，一旦頁面被加載，Vue 將接管這些靜態內容，並將其轉換成一個完整的單頁應用（ SPA ），其他的頁面則會只在用戶瀏覽到的時候才按需加載。除此之外，它還內置了以下優秀特性：

• 為技術文檔而優化的內置Markdown 拓展
• 在Markdown 文件中使用Vue 組件的能力
• Vue 驅動的自定義主題系統
• 自動生成Service Worker
• Google Analytics 集成
• 多語言支持
• 默認主題包含：
  • 響應式佈局
  • 可選的主頁
  • 簡潔的開箱即用的標題搜索
  • Algolia 搜索
  • 可自定義的導航欄和側邊欄
  • 自動生成的GitHub 鏈接和頁面的編輯鏈接

相比與Nuxt 、 Hexo 、 Jekyll 、 Docsify 、 GitBook等工具， VuePress在不同方向，都擁有著巨大優勢，並且仍在開發更新當中；如果你有搭建個人博客、技術文檔的需求，那麼VuePress將是超棒的選擇。

附加功能

• 添加基於Github Issue的評論功能(相當於內置Gitalk )；只需修改.vuepress/themeConfig.js文件中comment字段配置即可；具體字段含義，可參見Gitalk Options；
• 有添加element-ui依賴，以方便編寫常用組件；此項目中，內置除了評論組件外，還有Advertisement （廣告）、 ArticleList （文章列表）、 Contact （聯繫方式）等；
• 引入prettier , lint-staged , husky等依賴，從而使得寫出更合乎'規範'的markdown；同時注入至Git hooks，以確保你的代碼庫具有一致的風格；即使你正與團隊合作編寫，也不必為統一風格的問題而感到憂慮！

如何使用

可將項目Fork至自己的代碼倉庫，運行以下命令即可：

 # ? clone the project
https://github.com/nicejade/vuepress-web-app.git
cd vuepress-web-app

# ➕ install dependencies & start dev
yarn && yarn start

修改deploy.sh文件中的“自定義域名”以及“倉庫路徑”，運行如下命令，即可實現部署（默認發布至github pages ；如果暫不使用自定義域名，註釋該行即可。

 #  deploy to github-page
yarn deploy

相關鏈接

• 傾城之鍊
• About Me
• 個人博客
• 靜軒之別苑
• 靜晴軒別苑
• 吾意靜晴軒
• 天意人間舫
• 新浪微博
• 知乎主頁
• 簡書主頁
• SegmentFault
• Twitter
• Facebook

微信公眾號	前端微信群	推薦Web 應用
靜晴軒	大前端聯盟	? 傾城之鍊

許可執照

MIT

Copyright (c) 2018-present, nicejade