用 Git 建立和托管網(wǎng)站

時(shí)間：2023-05-29 16:03:02 | 來(lái)源：網(wǎng)站運(yùn)營(yíng)

時(shí)間：2023-05-29 16:03:02 來(lái)源：網(wǎng)站運(yùn)營(yíng)

用 Git 建立和托管網(wǎng)站：

你可以讓 Git 幫助你輕松發(fā)布你的網(wǎng)站。在我們《鮮為人知的 Git 用法》系列的第一篇文章中學(xué)習(xí)如何做到。
-- Seth Kenlon（作者）

Git 是一個(gè)少有的能將如此多的現(xiàn)代計(jì)算封裝到一個(gè)程序之中的應(yīng)用程序，它可以用作許多其他應(yīng)用程序的計(jì)算引擎。雖然它以跟蹤軟件開(kāi)發(fā)中的源代碼更改而聞名，但它還有許多其他用途，可以讓你的生活更輕松、更有條理。在這個(gè) Git 系列中，我們將分享七種鮮為人知的使用 Git 的方法。

創(chuàng)建一個(gè)網(wǎng)站曾經(jīng)是極其簡(jiǎn)單的，而同時(shí)它又是一種黑魔法。回到 Web 1.0 的舊時(shí)代（不是每個(gè)人都會(huì)這樣稱呼它），你可以打開(kāi)任何網(wǎng)站，查看其源代碼，并對(duì) HTML 及其內(nèi)聯(lián)樣式和基于表格的布局進(jìn)行反向工程，在這樣的一兩個(gè)下午之后，你就會(huì)感覺(jué)自己像一個(gè)程序員一樣。不過(guò)要讓你創(chuàng)建的頁(yè)面放到互聯(lián)網(wǎng)上，仍然有一些問(wèn)題，因?yàn)檫@意味著你需要處理服務(wù)器、FTP 以及 webroot 目錄和文件權(quán)限。雖然從那時(shí)起，現(xiàn)代網(wǎng)站變得愈加復(fù)雜，但如果你讓 Git 幫助你，自出版可以同樣容易（或更容易?。?br>

用 Hugo 創(chuàng)建一個(gè)網(wǎng)站

Hugo 是一個(gè)開(kāi)源的靜態(tài)站點(diǎn)生成器。靜態(tài)網(wǎng)站是過(guò)去的 Web 的基礎(chǔ)（如果你回溯到很久以前，那就是 Web 的全部了）。靜態(tài)站點(diǎn)有幾個(gè)優(yōu)點(diǎn)：它們相對(duì)容易編寫(xiě)，因?yàn)槟悴槐鼐帉?xiě)代碼；它們相對(duì)安全，因?yàn)轫?yè)面上沒(méi)有執(zhí)行代碼；并且它們可以非?？欤?yàn)槌嗽陧?yè)面上傳輸?shù)娜魏蝺?nèi)容之外沒(méi)有任何處理。

Hugo 并不是唯一一個(gè)靜態(tài)站點(diǎn)生成器。Grav、Pico、Jekyll、Podwrite 以及許多其他的同類軟件都提供了一種創(chuàng)建一個(gè)功能最少的、只需要很少維護(hù)的網(wǎng)站的簡(jiǎn)單方法。Hugo 恰好是內(nèi)置集成了 GitLab 集成的一個(gè)靜態(tài)站點(diǎn)生成器，這意味著你可以使用免費(fèi)的 GitLab 帳戶生成和托管你的網(wǎng)站。

Hugo 也有一些非常大的用戶。例如，如果你曾經(jīng)去過(guò) Let’s Encrypt 網(wǎng)站，那么你已經(jīng)用過(guò)了一個(gè)用 Hugo 構(gòu)建的網(wǎng)站。







安裝 Hugo

Hugo 是跨平臺(tái)的，你可以在 Hugo 的入門(mén)資源中找到適用于 MacOS、Windows、Linux、OpenBSD 和 FreeBSD 的安裝說(shuō)明。

如果你使用的是 Linux 或 BSD，最簡(jiǎn)單的方法是從軟件存儲(chǔ)庫(kù)或 ports 樹(shù)安裝 Hugo。確切的命令取決于你的發(fā)行版，但在 Fedora 上，你應(yīng)該輸入：

$ sudo dnf install hugo通過(guò)打開(kāi)終端并鍵入以下內(nèi)容確認(rèn)你已正確安裝：

$ hugo help這將打印 hugo 命令的所有可用選項(xiàng)。如果你沒(méi)有看到，你可能沒(méi)有正確安裝 Hugo 或需要將該命令添加到你的路徑。

創(chuàng)建你的站點(diǎn)

要構(gòu)建 Hugo 站點(diǎn)，你必須有個(gè)特定的目錄結(jié)構(gòu)，通過(guò)輸入以下命令 Hugo 將為你生成它：

$ hugo new site mysite你現(xiàn)在有了一個(gè)名為 mysite 的目錄，它包含構(gòu)建 Hugo 網(wǎng)站所需的默認(rèn)目錄。

Git 是你將網(wǎng)站放到互聯(lián)網(wǎng)上的接口，因此切換到你新的 mysite 文件夾，并將其初始化為 Git 存儲(chǔ)庫(kù)：

$ cd mysite$ git init .Hugo 與 Git 配合的很好，所以你甚至可以使用 Git 為你的網(wǎng)站安裝主題。除非你計(jì)劃開(kāi)發(fā)你正在安裝的主題，否則可以使用 --depth 選項(xiàng)克隆該主題的源的最新?tīng)顟B(tài)：

$ git clone --depth 1 https://github.com/darshanbaral/mero.git themes/mero現(xiàn)在為你的網(wǎng)站創(chuàng)建一些內(nèi)容：

$ hugo new posts/hello.md使用你喜歡的文本編輯器編輯 content/posts 目錄中的 hello.md 文件。Hugo 接受 Markdown 文件，并會(huì)在發(fā)布時(shí)將它們轉(zhuǎn)換為經(jīng)過(guò)主題化的 HTML 文件，因此你的內(nèi)容必須采用 Markdown 格式。

如果要在帖子中包含圖像，請(qǐng)?jiān)?static 目錄中創(chuàng)建一個(gè)名為 images 的文件夾。將圖像放入此文件夾，并使用以 /images 開(kāi)頭的絕對(duì)路徑在標(biāo)記中引用它們。例如：

![A picture of a thing](/images/thing.jpeg)

選擇主題

你可以在 themes.gohugo.io 找到更多主題，但最好在測(cè)試時(shí)保持一個(gè)基本主題。標(biāo)準(zhǔn)的 Hugo 測(cè)試主題是 Ananke。某些主題具有復(fù)雜的依賴關(guān)系，而另外一些主題如果沒(méi)有復(fù)雜的配置的話，也許不會(huì)以你預(yù)期的方式呈現(xiàn)頁(yè)面。本例中使用的 Mero 主題捆綁了一個(gè)詳細(xì)的 config.toml 配置文件，但是（為了簡(jiǎn)單起見(jiàn)）我將在這里只提供基本的配置。在文本編輯器中打開(kāi)名為 config.toml 的文件，并添加三個(gè)配置參數(shù)：

languageCode = "en-us"title = "My website on the web"theme = "mero"[params] author = "Seth Kenlon" description = "My hugo demo"

預(yù)覽

在你準(zhǔn)備發(fā)布之前不必（預(yù)先）在互聯(lián)網(wǎng)上放置任何內(nèi)容。在你開(kāi)發(fā)網(wǎng)站時(shí)，你可以通過(guò)啟動(dòng) Hugo 附帶的僅限本地訪問(wèn)的 Web 服務(wù)器來(lái)預(yù)覽你的站點(diǎn)。

$ hugo server --buildDrafts --disableFastRender打開(kāi) Web 瀏覽器并導(dǎo)航到 http://localhost:1313 以查看正在進(jìn)行的工作。

用 Git 發(fā)布到 GitLab

要在 GitLab 上發(fā)布和托管你的站點(diǎn)，請(qǐng)為你的站點(diǎn)內(nèi)容創(chuàng)建一個(gè)存儲(chǔ)庫(kù)。

要在 GitLab 中創(chuàng)建存儲(chǔ)庫(kù)，請(qǐng)單擊 GitLab 的 “Projects” 頁(yè)面中的 “New Project” 按鈕。創(chuàng)建一個(gè)名為 yourGitLabUsername.gitlab.io 的空存儲(chǔ)庫(kù)，用你的 GitLab 用戶名或組名替換 yourGitLabUsername。你必須使用此命名方式作為該項(xiàng)目的名稱。你也可以稍后為其添加自定義域。

不要在 GitLab 上包含許可證或 README 文件（因?yàn)槟阋呀?jīng)在本地啟動(dòng)了一個(gè)項(xiàng)目，現(xiàn)在添加這些文件會(huì)使將你的數(shù)據(jù)推向 GitLab 時(shí)更加復(fù)雜，以后你可以隨時(shí)添加它們）。

在 GitLab 上創(chuàng)建空存儲(chǔ)庫(kù)后，將其添加為 Hugo 站點(diǎn)的本地副本的遠(yuǎn)程位置，該站點(diǎn)已經(jīng)是一個(gè) Git 存儲(chǔ)庫(kù)：

$ git remote add origin git@gitlab.com:skenlon/mysite.git創(chuàng)建名為 .gitlab-ci.yml 的 GitLab 站點(diǎn)配置文件并輸入以下選項(xiàng)：

image: monachus/hugovariables: GIT_SUBMODULE_STRATEGY: recursivepages: script: - hugo artifacts: paths: - public only: - masterimage 參數(shù)定義了一個(gè)為你的站點(diǎn)提供服務(wù)的容器化圖像。其他參數(shù)是告訴 GitLab 服務(wù)器在將新代碼推送到遠(yuǎn)程存儲(chǔ)庫(kù)時(shí)要執(zhí)行的操作的說(shuō)明。有關(guān) GitLab 的 CI/CD（持續(xù)集成和交付）選項(xiàng)的更多信息，請(qǐng)參閱 GitLab 文檔的 CI/CD 部分。

設(shè)置排除的內(nèi)容

你的 Git 存儲(chǔ)庫(kù)已配置好，在 GitLab 服務(wù)器上構(gòu)建站點(diǎn)的命令也已設(shè)置，你的站點(diǎn)已準(zhǔn)備好發(fā)布了。對(duì)于你的第一個(gè) Git 提交，你必須采取一些額外的預(yù)防措施，以便你不會(huì)對(duì)你不打算進(jìn)行版本控制的文件進(jìn)行版本控制。

首先，將構(gòu)建你的站點(diǎn)時(shí) Hugo 創(chuàng)建的 /public 目錄添加到 .gitignore 文件。你無(wú)需在 Git 中管理已完成發(fā)布的站點(diǎn)；你需要跟蹤的是你的 Hugo 源文件。

$ echo "/public" >> .gitignore如果不創(chuàng)建 Git 子模塊，則無(wú)法在 Git 存儲(chǔ)庫(kù)中維護(hù)另一個(gè) Git 存儲(chǔ)庫(kù)。為了簡(jiǎn)單起見(jiàn)，請(qǐng)移除嵌入的存儲(chǔ)庫(kù)的 .git 目錄，以使主題（存儲(chǔ)庫(kù)）只是一個(gè)主題（目錄）。

請(qǐng)注意，你必須將你的主題文件添加到你的 Git 存儲(chǔ)庫(kù)，以便 GitLab 可以訪問(wèn)該主題。如果不提交主題文件，你的網(wǎng)站將無(wú)法成功構(gòu)建。

$ mv themes/mero/.git ~/.local/share/Trash/files/你也可以像使用回收站一樣使用 trash：

$ trash themes/mero/.git現(xiàn)在，你可以將本地項(xiàng)目目錄的所有內(nèi)容添加到 Git 并將其推送到 GitLab：

$ git add .$ git commit -m 'hugo init'$ git push -u origin HEAD

用 GitLab 上線

將代碼推送到 GitLab 后，請(qǐng)查看你的項(xiàng)目頁(yè)面。有個(gè)圖標(biāo)表示 GitLab 正在處理你的構(gòu)建。第一次推送代碼可能需要幾分鐘，所以請(qǐng)耐心等待。但是，請(qǐng)不要一直等待，因?yàn)樵搱D標(biāo)并不總是可靠地更新。







當(dāng)你在等待 GitLab 組裝你的站點(diǎn)時(shí)，請(qǐng)轉(zhuǎn)到你的項(xiàng)目設(shè)置并找到 “Pages” 面板。你的網(wǎng)站準(zhǔn)備就緒后，它的 URL 就可以用了。該 URL 是 yourGitLabUsername.gitlab.io/yourProjectName。導(dǎo)航到該地址以查看你的勞動(dòng)成果。







如果你的站點(diǎn)無(wú)法正確組裝，GitLab 提供了可以深入了解 CI/CD 管道的日志。查看錯(cuò)誤消息以找出發(fā)生了什么問(wèn)題。

Git 和 Web

Hugo（或 Jekyll 等類似工具）只是利用 Git 作為 Web 發(fā)布工具的一種方式。使用服務(wù)器端 Git 掛鉤，你可以使用最少的腳本設(shè)計(jì)你自己的 Git-to-web 工作流。使用 GitLab 的社區(qū)版，你可以自行托管你自己的 GitLab 實(shí)例；或者你可以使用 Gitolite 或 Gitea 等替代方案，并使用本文作為自定義解決方案的靈感來(lái)源。祝你玩得開(kāi)心！

---

via: https://opensource.com/article/19/4/building-hosting-website-git

作者：Seth Kenlon 選題：lujun9972 譯者：wxy 校對(duì)：wxy

本文由 LCTT 原創(chuàng)編譯，Linux中國(guó) 榮譽(yù)推出