写在前面
经过本教程指导,你可以在15分钟内搭建一个Hexo博客,完全免费,访问速度极佳。
基本原理:使用Hexo自带一键部署将静态页面上传到Github私人仓库,并通过Vercel部署到边缘节点。(速度比Cloudflare Pages更快)
初次搭建
安装
必要程序
前往Node.js和Git的官方网站下载对应操作系统的程序,这里以Windows为例。
开始部署
这里以在E盘的myblog文件夹部署Hexo博客为例:
首先,创建好对应的文件夹。
接着,打开cmd,进入E盘
E:
然后我们通过npm安装Hexo
npm install -g hexo-cli
我们把Hexo安装进myblog文件夹
hexo init myblog
cd myblog
npm install
此时Hexo程序已经部署进了myblog文件夹,我们可以打开_config.yml
修改配置
配置如何修改,在Hexo官方文档中都说明了。
安装主题
下面,我们以argon主题为例,安装这款主题。
打开主题文件夹,Git这款主题。
cd theme
git clone https://github.com/solstice23/hexo-theme-argon.git
npm install hexo-renderer-ejs
重命名 Clone 后的文件夹为 argon
在 Hexo 根目录/_config.yml
中将 theme
项改为 argon
将 Hexo 根目录/themes/argon/_config.yml
复制到 Hexo 根目录/source/_data
文件夹中,并重命名为 argon.yml
修改复制后的配置文件(有中文提示)
在 Hexo 根目录/themes
目录下执行
npm install hexo-generator-search --save
在 Hexo 根目录/_config.yml
中添加选项
search:
path: search.xml
field: post
content: true
发布你的第一篇文章
在myblog文件夹内执行这个命令
hexo new 文章标题
系统会在source/_posts
文件夹内生成对应的md文件,只需要打开文件,使用markdown语法编写文章即可。
文章头部可以编辑相关信息:
title: 文章标题
date: 2022-08-08 21:11:30
tags:
- 标签1
- 标签2
- 标签3
categories: 分类名称
预览你的网站
打开cmd,启动Hexo服务器。
E:
cd myblog
hexo server
此时访问 http://localhost:4000/ 就可以查看你的博客了。
上传网站
如果对你的网站效果感到满意,你可以使用Hexo提供的一键部署服务把页面提交到Github。
首先,你需要在Github上创建一个私人的仓库。
接着,你需要安装Hexo一键部署服务。
npm install hexo-deployer-git --save
然后,打开_config.yml
,更改deploy
部分的配置,如下:
deploy:
type: git
repo: https://github.com/<username>/<project>
# example, https://github.com/hexojs/hexojs.github.io
branch: gh-pages
最后,在myblog文件夹内执行一键部署命令。
hexo clean && hexo deploy
首次使用可能会唤起浏览器验证Github账号。
完成后,你可以在你的仓库内看到你的网站静态页面。
上线网站
打开 https://vercel.com/ ,使用Github账号登录
选择右上角新项目,在导入Git存储库页面连接到Github账户,这样就可以看到你账户内所有的仓库了,选择你存放博客的仓库,点击部署。
打开部署完成的项目,可以看到域名设置选项,在这里可以自定义域名,只需要根据指引在任意DNS平台添加一条记录就可以了。(不像Cloudflare一样强制更改nameserver)
在项目设置中,打开无服务器函数选项,可以将服务器改为香港节点,这样或许可以降低延迟。
更新博客
像第一次发布文章一样,你可以进一步新增文章;通过更改主题配置,你可以最大程度自定义你的主页。
像第一次启动Hexo服务器一样,你可以在本地预览网站。
同第一次一键部署一样,你可以执行相同的命令,网站会自动上传到Github存储库,Vercel发现存储库发生变化后,会自动重新部署,一切都是全自动的,你只需要执行一行命令。