159 字

Hugo 一个用于生成静态网站的框架,快速开始

Vercel 就是原来的 zeit.co 改名而来。

合并 Hugo 和 Vercel 的特性,可以快速部署一份自己的博客,而且费用全免。

第一步,建立自己的静态网站

直接参考 hugo 的快速开始即可:

# 安装 hugo
wget https://github.com/gohugoio/hugo/releases/download/v0.69.2/hugo_0.69.2_Linux-64bit.tar.gz
tar xf hugo_0.69.2_Linux-64bit.tar.gz hugo
chmod +x hugo

# 建立 MyBlog 网站项目
./hugo new site MyBlog
cd MyBlog

第二步,在 GitHub 上建立自己的私有项目

首先得有自己的 GitHub 账号,注册并登陆。

新建一个项目 MyBlog

  • Repository name: MyBlog
  • Private: You choose who can see and commit to this repository.

新建完毕后,获取项目地址: https://github.com/XXX/MyBlog 其中 XXX 就是 GitHub 账号名。

第三步,在 Vercel 建立并关联 MyBlog 项目

和 GitHub 一样,同样要先注册有 Vercel 账号。

引入 GitHub 的项目,先关联 GitHub 账号到 Vercel,并且选择 MyBlog 项目即可。

然后进去项目选择 Settings 配置 Build & Development Settings 的 FRAMEWORK RESET 为 Hugo,其他都不用修改。

第五步,提交自己的博客

这个时候就要将自己本地的 MyBlog 项目用 Git 进行管理。

# 回到第一步的终端内,紧跟着 cd MyBlog 命令后
git init
git remote add origin https://github.com/XXX/MyBlog # 此处为第二步得到的项目地址
git add archetypes config.toml content data layouts resources static themes
git commit -a -m 'init'
git push -u origin master

在 Vercel 项目 Deployments 页面可以看到等待 Vercel 进行努力编译 MyBlog 了~

经过漫长的几十秒编译后,你就得到第一个静态网站项目: MyBlog.XXX.now.sh 其中 XXX 就是你的用户名。

到此有更多可以处理的。

  1. 选择自己的域名绑定,相关内容在 Vercel 项目的 Settings / Domains 内
  2. 静态网站增加内容,默认建立的网站是一个完全空白的页面(当然啦,毕竟是自己的网站),新建一些内容吧:快速开始