1. 程式人生 > >Hexo個人免費部落格(一) 從零到釋出Github

Hexo個人免費部落格(一) 從零到釋出Github

之前使用過jekyll+github做過一版自己的部落格網站,有興趣的可以看一下我之前的文章:http://blog.csdn.net/linshuhe1/article/details/51143026,其實也很簡單,但是存在一些問題:目錄、Rss、sitemap無法自動生成。

最近看到了別人使用hexo+github實現的部落格,有更多的靈活性和簡約的風格,所以也試著改一下自己原本的設計。
參考資料:
- EZLippi-浮生志:Jekyll遷移到Hexo搭建個人部落格
- iissnan的Next主題:Next使用文件

什麼是hexo:

hexo是一個基於Node.js的靜態部落格程式,可以方便的生成靜態網頁託管到github或者Heroku上,類似於jekyll、Octopress、Wordpress等,使用markdown來寫文章。hexo的作者是

https://github.com/tommy351/hexo。具有以下幾點優點:

  • 易用性,部署很簡單,常用指令有:hexo newhexo generatehexo serverhexo deploy
  • 輕量級,檔案少而小,自定義方便

相關知識:

hexo配置過程中使用到了GithubGitMarkdownNode.js等相關操作,所以需要很多外掛、widget需要自己安裝配置。

安裝準備:

安裝Github桌面版和配置

  1. 雙擊下載好的GitHubSetup.exe檔案,按照預設設定完成安裝;
  2. 登入自己的github賬號;
  3. 在github網頁上建立一個以username.github.io
    命名的repositories,此時username為自己github的賬號名稱;
  4. 開啟Git Shell,使用配置SSH Key使本地git專案與遠端Github建立聯絡:ssh -T [email protected]

安裝Node.js

直接雙擊下載好的node-v4.5.0-x64.msi選擇指定的安裝路徑,按照預設設定完成安裝操作,安裝完成後不需要對Node.js進行任何配置。為了檢驗是否完成安裝,可以開啟命令列,輸入指令:npm --version進行版本號查詢。

安裝Hexo:

1.安裝:

mkdir hexo #建立一個專案檔案
cd hexo    #進入專案檔案目錄
npm install -g hexo-cli
npm install hexo --save

npm是Node.js中的一個工具,所以在安裝Hexo之前應該先安裝Node.js

2.部署Hexo:

在Git shell中輸入:

hexo init

記得輸入之前需要確保當前命令列所處目錄為所要建立工程的根目錄下,因為此操作的結果就是將hexo的一些必要檔案複製到當前目錄下面。

看到上圖結果之後,可以通過以下指令執行部落格:

hexo server


執行正常的話可以通過訪問:http://localhost:4000/檢視執行結果:

假如出現了hexo服務啟動成功,但是瀏覽器訪問localhost:4000一直不響應,那就有可能是因為你的裝置上裝了其他軟體佔用了4000埠,一般有兩種辦法可以解決:

  • 在服務管理中將佔用該埠的服務停止掉,通常安裝了福昕閱讀器的就會佔用4000,把其對應的後臺服務關掉即可;
  • 切換hexo啟動的預設埠,使用以下指令:
    hexo s -p 5000

此時啟動埠就變成了5000,訪問地址變成了localhost:5000。

3.安裝Hexo外掛:

主要目的是為了讓其自動生成sitemap,Rss,部署到git等,這些是額外的外掛,假如不需要使用到這些功能可以不新增:

npm install hexo-generator-index --save
npm install hexo-generator-archive --save
npm install hexo-generator-category --save
npm install hexo-generator-tag --save
npm install hexo-server --save
npm install hexo-deployer-git --save
npm install hexo-deployer-heroku --save
npm install hexo-deployer-rsync --save
npm install hexo-deployer-openshift --save
npm install [email protected] --save
npm install [email protected] --save
npm install [email protected] --save
npm install [email protected] --save

將當前工程上傳到github

1.修改配置檔案:

在當前專案的根目錄下找到_config.yml配置檔案,用編輯器開啟,並找到Deployment標籤處deploy節點,填寫以下配置資訊,type是指定拖過平臺型別,repository指定了github上建立的repository倉庫地址,branch指定了版本型別。(注:冒號後面需要加一個空格,否則會出現報錯)

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: github
  repository: https://github.com/linshuhe1/linshuhe1.github.io.git
  branch: master

2.將專案deploy到github倉庫:

開啟Git shell進入當前專案的根目錄,依次執行指令:

hexo clean
hexo generate
hexo deploy

一般執行最後一步的時候會出現錯誤如下:

解決錯誤的方法是:將deploy的type改成git,然後在Git shell中執行:

npm install hexo-deployer-git --save

執行結束後再次執行上述三個指令,正確結果應該如下:

如此我們便完成了將本地的hexo工程deploy到github上的操作,訪問地址:https://username.github.io/可以看到頁面效果,這裡以我的github為例:https://linshuhe1.github.io/

相關推薦

Hexo個人免費部落() 釋出Github

之前使用過jekyll+github做過一版自己的部落格網站,有興趣的可以看一下我之前的文章:http://blog.csdn.net/linshuhe1/article/details/51143026,其實也很簡單,但是存在一些問題:目錄、Rss、si

Hexo個人免費部落(五) 使用自己的域名

使用了一段時間在github上搭建的hexo個人部落格空間,使用markdown寫部落格既方便,展示出來的樣式也還算滿意,唯一的缺點就是域名 github.io 總覺得有點累贅,另外就是訪問速度比較慢,今天就試著來解決其中的一個問題:把訪問域名替換成自己的域名。

Hexo個人免費部落(四) 部署到Coding.net

引言: 之前的部落格我們已經完成了個人Hexo部落格的搭建和配置,並且部署到Github上,具體過程可以參考我之前的部落格《Hexo個人免費部落格(一) 從零到釋出Github》,但是國

hexo+gitHub搭建個人獨立部落()

最新資訊 谷歌的一篇文章則著重說明了新成立的指導小組將如何“讓MDN成為最好的Web參考文件,幫助我們更好地進行Web開發”。指導小組目前的成員包括微軟、谷歌、Mozilla、三星和W3C。值得注意的是,蘋果公司並沒有參與這次釋出宣告。 前言 一直想要

Github+Jekyll —— 建立個人免費部落(四)jekyll第一個頁面

摘要:         本文中我將介紹一下如何在github上搭建個人Blog(部落格),也順便讓我們掌握一下githubPages功能,另外還涉及到Jekyll技術。 ===========

Github+Jekyll —— 建立個人免費部落(五)jekyll工程釋出github

摘要:         本文中我將介紹一下如何在github上搭建個人Blog(部落格),也順便讓我們掌握一下githubPages功能,另外還涉及到Jekyll技術。 ===========

hexo個人靜態部落(總結、記錄)

一、windows環境下hexo安裝 我的環境是win7 64位 1、安裝前提 安裝 Hexo 相當簡單。然而在安裝前,您必須檢查電腦中是否已安裝下列應用程式:依次下載安裝。 1. Node.js 2. git 安裝預設下一步即可 2、安裝

獨立部落到千萬訪問,這三年我都做了什麼

初衷 寫博這件事,其實從大學開始就一直斷斷續續的有在做,幾大部落格平臺都有玩過,但是都不持久。真正想要認真地好好維護一個自己的部落格是在2015年年底。 為什麼突然就想好好寫部落格呢?其實與過去三年的工作經歷直接相關。我的技術學習之路可以與很多人都不太一樣。由於那三年裡,我的工作都在工商銀行任職,雖然,工

Mac上基於hexo+GitHub搭建個人部落()

之前一直使用部落格園和簡書,但是部落格園太複雜,而簡書雖然很簡單,但是沒什麼新鮮感,偶然得知hexo+github可以搭建自己的部落格,主要是可以自己定主題,還很simple,因此,找了個時間,自己搞了一下,感覺還可以,就自己弄了一個。 1 環境配置 Hexo官網上有搭建文件! 1.1 安

晚上搭建個人域名部落Github+Hexo

搭建個人域名部落格其實沒有那麼難。下班到家後,九點開始,十二點半的時候就可以訪問了http://www.lvchongstudio.top。 接下來就記錄一下整個搭建的過程,以及這其中的坑,重點是坑。 首先要準備的環境 Node.js git 阿里雲購

Hexo + Github搭建靜態部落()

快速介紹 Hexo是一個基於Node.js搭建的靜態部落格框架,通過Hexo,使用者可以以博文的方式釋出Markdown文件。結合預設或定製化主題模板(很像其他靜態部落格生成框架,Jekyll或Ghost)博文會被轉化和生成為HTML/CSS。Hexo所需的所有元件都是模組化的,可以按

使用hexo,-github,-coding搭建免費部落

Updated March 6, 2018 準備環境 windows10 x64 node.js v8.9.3 git version 2.16.1.windows.4 Markdown編輯器:http://markdownpad.com/ 熟練掌握git和github的基本操作

程式設計師如何用GitHub打造個人部落()

準備工作: Hexo : 基於Node的一個靜態部落格框架,可以方便生成靜態網頁託管在github上 node,js : 用來生成靜態頁面。 Node.js官網下載 git :本地資料提交至gith

用laravel構建個人部落()

安裝laravel 安裝composer laravel使用composer管理依賴的類庫,首先要安裝composer。具體步驟見:https://getcomposer.org/download/ 。 下載laravel composer global

使用GitHub+Hexo+hexo-theme-indigo(主題)搭建自己的個人技術部落

本次搭建實在windows系統下完成: 前提條件:已經下載git、Hexo、node.js等必要的工具環境 第一步:初始化一個本地的Hexo專案 再本地建立一個部落格系統目錄:我建立的是專案根目錄:OyjBlog 再OyjBlog目錄下右鍵開啟Git Bash終端

SpringBoot開發個人部落()

嗯~ o(* ̄▽ ̄*)o大家好,今天在網上看見一篇部落格頁面佈局很好看--很羨慕所以決定自己也來搭建一個部落格系統並一直維護下去,主要CSDN說實話有點醜,像我這種注重生活品味和UI設計於一身的人一定要有一個自己風格的部落格,比如我的偶像的部落格,這篇實戰教程我打算花一個月的

Hexo+NexT():最全Hexo+Next搭建部落教程

快速、簡潔且高效的部落格框架 有位大神說,喜歡寫部落格的人的人,折騰部落格會經歷三個階段。找到一個免費空間,搭建一個部落格,很欣喜,很有成就感,此為一階段;受限免費空間各種限制,自己買空間和域名,實現對部落格的完全控制,此為二階段;管理網站太累,只想安安靜靜碼文字,管理網站這種瑣事,交給專業的人士去打理吧

乾貨!0開始,0成本搭建個人動態部落

首發於微信公眾號《前端成長記》,寫於 2019.10.12 導讀 有句老話說的好,好記性不如爛筆頭。人生中,總有那麼些東西你願去執筆寫下。 本文旨在把整個搭建的過程和遇到的問題及解決方案記錄下來,希望能夠給你帶來些許幫助。 本文涉及的主要技術: Vue3.0 - Composition API Grap

Hexo結合Stun靜態部落搭建入門到入土

## 摘要 * 安裝npm,安裝hexo相關依賴,安裝主題stun * 修改hexo配置,修改stun配置,部署到github,gitee實現靜態訪問 * 給部落格加上全域性搜尋,訪問量統計 * hexo部落格編寫模板 > tips: 以下{$xxx}均為使用者自定義 ## 搭建環境 ##

基於mkdocs-material搭建個人靜態部落

基於mkdocs-material搭建個人純靜態部落格,沒有php,沒有mysql 如果你只是想安安靜靜的放一些技術文章,釋出到個人站點或github-pages,mkdocs-material很適合你 小慢哥的原創文章,歡迎轉載 本文僅是縮略,筆者已將詳細內容釋出到github上