/vuepress-web-app

📝 Web applications built with Vuepress

Primary LanguageShell

静晴轩别苑

采用 VuePress 构建的 Web 应用程序:https://nice.lovejade.cn

目标与哲学

静晴轩别苑的诞生,其初衷完全是为了体验 VuePress: Vue 驱动的静态网站生成器。VuePress 由两部分组成:一部分是支持用 Vue 开发主题的极简静态网站生成器,另一个部分是为书写技术文档而优化的默认主题。它的诞生初衷是为了支持 Vue 及其子项目的文档需求。

每一个由 VuePress 生成的页面都带有预渲染好的 HTML,也因此具有非常好的加载性能和搜索引擎优化(SEO)。同时,一旦页面被加载,Vue 将接管这些静态内容,并将其转换成一个完整的单页应用(SPA),其他的页面则会只在用户浏览到的时候才按需加载。除此之外,它还内置了以下优秀特性:

相比与 NuxtHexoJekyllDocsifyGitBook 等工具,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
git clone https://github.com/${your-github-id}/vuepress-web-app
cd vuepress-web-app

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

修改 deploy.sh 文件中的“自定义域名”以及“仓库路径”,运行如下命令,即可实现部署(默认发布至 github pages;如果暂不使用自定义域名,注释该行即可。

# 🚀 deploy to github-page
yarn deploy

相关链接

微信公众号 前端微信群 推荐 Web 应用
😉 静晴轩 ✨ 大前端联盟 🎉 倾城之链
静晴轩 倾城之链 倾城之链

许可执照

MIT

Copyright (c) 2018-present, nicejade