前言
本站使用Hugo搭建,部署在cloudflare pages上,能够实现免域名、免服务器搭建。总之就是能通过白嫖获得一个自己的博客。
Hugo 安装
你可以参考Hugo官方的安装指导 Hugo的安装非常简单,在大多数平台上只需要一行命令就能完成安装 这里简要说一下Windows平台的安装方法 首先Windows平台的Hugo安装需要使用Chocolatey作为包管理器。如果你没有Chocolatey,那么首先需要安装它。 Chocolatey的安装也非常简单只需要一行如下命令:
如果你使用的是cmd,则执行
@"%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"
如果你使用的是powershell,则执行
Set-ExecutionPolicy Bypass -Scope Process -Force; iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))
之后稍等片刻即可安装成功
通过使用命令
choco -?
可以验证是否安装成功,安装成功的话运行上述命令会出现Chocolatey的帮助信息
之后按照Hugo官方安装文档即可完成Hugo安装 我更推荐安装hugo-exxtended
choco install hugo-extended -confirm
博客项目搭建
安装完Hugo之后,接下来就要进行博客项目的搭建。
这里你也可以参照官方文档来食用
首先,你需要选择一个路径来存放你的博客项目
使用cd命令进入到你想要的路径之后
hugo new site 你的项目名
这样就能创建一个新的网站,命令执行完之后,当前路径下会出现一个 你的项目名 的一个文件夹,你的博客的数据就存放在这里。
下载Hugo主题
创建项目之后,我们需要一个精美的主题
本站使用的主题是Stack,你可以点击他的官方文档进行查看
可以在Stack的 GitHub 仓库的 Release页面 找到最新的稳定版。 下载后把 hugo-theme-stack-master 改名为 hugo-theme-stack 并放到站点目录的 theme 文件夹下
之后将theme/hugo-theme-stack/exampleSite文件夹下的所有内容拷贝到你的博客项目目录
编辑主题配置文件
主题的配置文件是刚刚拷贝到项目目录的config.yaml
参照官方文档给出的说明,你可以编辑他来自定义你的博客
发布你的第一篇文章
通过使用hugo new post/xxx.md来创建一篇文章
之后你的博客项目下的content/post文件夹下会出现xxx.md文件,这个文件中的内容就是你的文章的内容
运行Hugo站点
通过以上的这些操作,你的博客站点已经搭建完成,接下来我们可以尝试在本地运行这个站点来预览博客
hugo server -D
运行成功会出现以下提示
Start building sites …
hugo v0.88.1-5BC54738+extended windows/amd64 BuildDate=2021-09-04T09:39:19Z VendorInfo=gohugoio
| ZH-CN
-------------------+--------
Pages | xx
Paginator pages | x
Non-page files | x
Static files | x
Processed images | x
Aliases | xx
Sitemaps | x
Cleaned | x
Built in 486 ms
Watching for changes in D:\code\HTML\xxx\{archetypes,assets,content,data,layouts,static,themes}
Watching for config changes in D:\code\HTML\xxx\config.yaml
Environment: "development"
Serving pages from memory
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop
使用浏览器打开http://localhost:1313/就能看到你的站点了
部署你的站点到Cloud flare Pages
一个只能在本地运行的博客站点是毫无意义的
所以我们需要将博客部署到互联网上
目前有很多的服务商都提供了Pages功能,比如github gitee等,我这里选择cloud flare pages作为服务商
创建github仓库
要使用Cloud flare Pages,你首先需要将你的博客项目上传到github 你需要创建一个git仓库,公开或者私有仓库都行,我更推荐使用私有仓库
之后将你的博客项目上传到github
配置Cloud flare Pages
访问 https://pages.cloudflare.com/ ,没有账号的可以按照提示注册,有账号的可以直接登录
进入pages页面点击创建项目

之后添加自己的github账号,并选择自己的博客项目

进入下一步架构预设选择Hugo,其他全部默认即可
注意,环境变量需要填写如下信息:
| 变量名称 | 值 |
|---|---|
| HUGO_VERSION | 0.88.1 |
之后等待部署成功即可
Cloud flare Pages会自动为你分配域名
默认为项目名称.pages.dev