Hugo 是一款快速搭建網(wǎng)站的主題框架，相對(duì)于 Hexo 來說， Hugo 的主題以及性能更加出色，并且類型上更加多元化，下面我們?cè)囍?Hugo 來搭建網(wǎng)站。詳情可以去 Hugo官網(wǎng) 查看.

Hugo 是一個(gè)用 Go 語言編寫的靜態(tài)網(wǎng)站生成器。

在 Windows 上安裝 Hugo

在 Windows 上需要先安裝包管理工具，這樣再安裝 Hugo 就會(huì)節(jié)省很多時(shí)間，這里有兩種方式來讓你安裝包管理工具。

第一種方法:Chocolatey 包管理安裝

• 首先利用 PowerShell 打開，運(yùn)行

Set-ExecutionPolicy Bypass -Scope Process -Force

如果有權(quán)限提示，輸入 Y,

• 接著輸入這一串

@"%SystemRoot%\System32\WindowsPowerShell\v1.0\powershell.exe" -NoProfile -InputFormat None -ExecutionPolicy Bypass -Command "iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))" && SET "PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin" 復(fù)制代碼

• 成功后輸入 choco install hugo -confirm 安裝 Hugo,即可開始安裝。另外需要主要的是，如果等待很久還沒有出現(xiàn)安裝成功的提示，那這個(gè)就要考慮是否已經(jīng)翻墻，翻墻的更容易安裝上?

第二種方法：Scoop 包管理安裝

• 打開 PowerShell ，輸入

iex（new-object net.webclient）.downloadstring（' https://get.scoop.sh '）

• 安裝成功后輸入scoop install hugo

接下來跟著下面步驟即可

在 Mac上安裝

在 Mac 上安裝也需要先安裝包管理工具，我們假設(shè)已經(jīng)安裝了 brew ，接著開始安裝 Hugo

第1步：安裝 Hugo

brew install hugo

安裝完成后，我們看一下當(dāng)前版本，如果出來版本，說明我們已經(jīng)安裝成功了：

hugo version

第2步：創(chuàng)建一個(gè)新網(wǎng)站

選擇一個(gè)在你要存放網(wǎng)站的地方，創(chuàng)建文件夾名為 xxx 的網(wǎng)站，然后在當(dāng)前文件夾內(nèi)執(zhí)行:

hugo new site xxx

創(chuàng)建的站點(diǎn)文件目錄說明：

|- archetypes ：存放default.md，頭文件格式

|- content ：content目錄存放博客文章（.markdown/.md文件）

|- data ：存放自定義模版，導(dǎo)入的toml文件（或json，yaml）

|- layouts ：layouts目錄存放的是網(wǎng)站的模板文件

|- static ：static目錄存放js/css/img等靜態(tài)資源

|- config.toml ：config.toml是網(wǎng)站的配置文件

這個(gè)時(shí)候，創(chuàng)建出來的網(wǎng)站是沒有任何內(nèi)容的，需要下載個(gè)主題跑起來才有內(nèi)容。

第3步：添加主題

這里有各種各樣的主題包:themes.gohugo.io，選上一種進(jìn)行下一步

cd xxx

git init

git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke

注意：有些主題步驟會(huì)跟上面不一致，可以直接到該主題下按照步驟操作即可

第4步：添加一些內(nèi)容

下載好之后，現(xiàn)在還沒有文章，我們來寫一篇文章：

hugo new posts/my-first-post.md

這樣就會(huì)在posts目錄下生成一個(gè)markdown的文件，用markdown工具打開編輯內(nèi)容即可。

現(xiàn)在啟動(dòng)Hugo本地服務(wù)器 在xxx目錄下: hugo server -t 主題名字

出現(xiàn)

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

說明已經(jīng)成功。打開瀏覽器輸入http://localhost:1313看一看預(yù)覽效果。

第五步 上傳到github

這個(gè)時(shí)候本地網(wǎng)址已經(jīng)搭建好了，可以上傳到github上。

• 在xxx目錄下，如果已經(jīng)有public文件夾，則刪除：`rm -rf public完全刪除該public目錄

• clone 倉庫: git submodule add -b master git@github.com:<USERNAME>/<USERNAME>.github.io.git public 出現(xiàn) Not a git repository 提示的話，是因?yàn)闆]有.git這樣一個(gè)目錄，創(chuàng)建一個(gè)即可： git init

• 在本地測試好之后： hugo --theme=xxx --baseUrl="https://xxx.github.io/"

• 更新git

  • cd 到 public 目錄，

  • git add * 全部更新

  • git commit -m "更新內(nèi)容"

  • git push https://github.com/xxx/xxx.github.io.git master

---

注意的地方

• 如果出現(xiàn):

To https://github.com/aniruddhabarapatre/learn-rails.git ! [rejected] master -> master (fetch first) error: failed to push some refs to 'https://github.com/aniruddhabarapatre/learn-rails.git' hint: Updates were rejected because the remote contains work that you do hint: not have locally. This is usually caused by another repository pushing hint: to the same ref. You may want to first merge the remote changes (e.g., hint: 'git pull') before pushing again. hint: See the 'Note about fast-forwards' in 'git push --help' for details.復(fù)制代碼

用：git push -f https://github.com/xxx/xxx.github.io.git master 強(qiáng)制更新

總結(jié)

以上是生活随笔為你收集整理的利用 GitHub 搭建独立 Web 网站的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。