利用GitHub搭建靜態網站
阿新 • • 發佈:2018-12-19
關於GitHub Page
- github 官方提供了github page功能用於生成專案的預覽效果,利用這一點,可以來搭建相對簡單的個人部落格網站,或者僅用於瀏覽的靜態網站。
- 使用github page搭建網站可用的兩種選擇:
Hexo
或jekyll
,二者都可用來生成將markdown文件生成靜態網頁,簡直是部落格生成神器。
靜態網站框架:hexo
和jekyll
- hexo
hexo依賴於Node.js和Git,這對從事前端工作的開發者來說,上手特別容易,官方安裝及使用教程也很詳盡。官方文件
- jekyll
jekyll是基於Ruby的,因此在安裝jekyll之前還需要先安裝Ruby,
官方安裝使用文件,當然,也有很多部落格教程,百度即有。 jekyll是github官方推薦的網站框架。
- 兩者區別:
我用的windows,jekyll的安裝相對麻煩,針對不同平臺的環境要求不太一樣,而hexo只需要安裝node和git就可以了。 在編譯效果上,jekyll 只需要直接上傳原博文到 github, 就能直接生成部落格,也可以用線上編輯器處理,而hexo 是先本地生成 html 再上傳。
用hexo搭建簡單部落格站
1. 安裝
Hexo依賴於
Node.js
,Git
,所以在安裝Hexo之前,需要先安裝Node及Git
# 安裝hexo npm install -g hexo-cli
2. 初始化網站目錄
hexo init <folder>
cd <folder>
npm install
- 目錄生成後結果:
. ├── _config.yml // 網站的 配置 資訊,您可以在此配置大部分的引數。 ├── package.json // 應用程式的資訊。EJS, Stylus 和 Markdown renderer 已預設安裝,可自由移除。 ├── scaffolds // 模版 資料夾。 ├── source // 資原始檔夾是存放使用者資源的地方。 | ├── _drafts | └── _posts └── themes // 主題 資料夾。Hexo 會根據主題來生成靜態頁面。
scaffolds
: Hexo的模板是指在新建的markdown檔案中預設填充的內容。例如,如果您修改scaffold/post.md中的Front-matter內容,那麼每次新建一篇文章時都會包含這個修改。_config.yml
: 更多配置引數