windows+hugo+github搭建個人博客


一、hugo下載地址:https://github.com/gohugoio/hugo/releases

1、選擇對應的最新zip包,我下載的是hugo_0.57.2_Windows-64bit.zip (ps.下面的extended包不用下載),下載完成后,解壓待用。

2、創建文件夾。此處舉例:F盤創建 hugo/bin,將解壓后的hugo.exe放到bin目錄下。

3、配置系統環境變量。將F:\hugo\bin加到path變量中,注意兩點: (1) 是path,不是CLASSPATH,要區分下 (2) 路徑后面記得加英文分號 ;

以上設置好后,就可以在cmd中查看是否安裝成功。執行命令:

$ hugo version

Hugo Static Site Generator v0.57.2-A849CB2D windows/amd64 BuildDate: 2019-08-17T17:54:13Z  顯示該條即表示成功

二、生成站點

進入F:\hugo下,打開命令窗口。(可用cmd,也可選擇下載安裝Git,推薦安裝git,敲命令很方便)

$ hugo new site 文件名稱 (如blog)

執行后,在hugo目錄下就會生成一個 名叫blog的站點文件夾

進入blog,顯示以下目錄結構:

  • archetypes (存放default.md,頭文件格式,每次新建文章默認顯示的頭部信息在此修改)

  • content    (存放博客文章,markdown格式文件)

  • data              (存放自定義或者導入的模板)

  • layouts          (存放網站的數據模板)

  • static             (存放圖片、css、js等靜態資源)

  • themes         (存放主題文件,每個主題都是一個獨立的文件夾)

  • config.toml    (網站配置文件)

三、創建文章

進入站點根目錄blog下,執行命令:

$ hugo new post/test.md

執行后,會自動在content/post下生成 test.md文件,打開可編輯內容,ps.文件頭部的draft要改為false,這樣部署后才能看到文章。

當前網站是沒有任何內容的,需要下載個主題。

四、下載主題

進入站點的themes目錄

$ cd themes

$ git clone https://github.com/spf13/hyde.git

(ps.可去https://themes.gohugo.io官網選擇其他主題下載)

這樣themes下就多了一個文件夾,文件夾名即為主題名稱。此時可回到站點目錄下打開config.toml配置指定主題。如theme = "hyde"  沒有theme參數就自己寫上

站點根目錄下,執行命令:

$ hugo server

執行后會顯示

............此處省略上方信息

Web Server is available at http://localhost:1313/ (bind address 127.0.0.1) Press Ctrl+C to stop

可訪問:http://localhost:1313/ 查看效果

五、部署github pages上

前提:已注冊GitHub賬號,登錄

1、登錄后,點擊右上角,出現下拉菜單,點擊 Your repositories 進入頁面

2、點擊 New

3、進入 Creat a new repository 頁面

4、圖中的 yourname 要換成自己的github的用戶名,即上圖中Owner顯示的用戶名。最后點擊Creat repository即完成

 

站點目錄config.tomlbaseURL要換成自己建立的倉庫,如baseURL = "https://yourname.github.io/"

進入站點根目錄下,執行:

$ hugo

執行后,站點根目錄下會生成一個 public 文件夾,該文件下的內容即Hugo生成的整個靜態網站。每次更新內容后,將 pubilc 目錄里所有文件 push到GitHub即可。

首次使用的時候要執行以下命令:

$ cd public

$ git remote add origin https://github.com/yourname/yourname.github.io.git (換成自己的)  將本地目錄鏈接到遠程服務器的代碼倉庫

$ git add -A

$ git commit -m "first commit"

$ git push -u origin master

以后每次站點目錄下執行 hugo 命令后,再到public下執行推送命令:

$ git add -A

$ git commit -m "修改內容什么的"

$ git push -u orgin master (此處較易出錯,error了就百度吧,問題可能千奇百怪)

之后就可以到GitHub上看提交到分支的內容,也可訪問 YOURNAME.github.io看頁面了。

總結

以上整個環境部署好之后,接下來的常用命令就是以下幾個:

站點目錄下,新建文章,執行:

$ hugo new post/文章名.md

添加文章內容或修修改改,包括修改主題之類的,在本地都可以實時看到

修改完成,確定要上傳到GitHub上后,站點目錄blog下執行:

$ hugo

進行編譯,沒錯誤的話修改的內容就順利同步到public下了,然后cd public下,執行提交命令:

$ git add -A

$ git commit -m "修改了啥"

$ git push -u origin master

至此OK,順利的話應該是一步到位的。若是遇到問題的話再百度咯


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM