抱歉,您的浏览器无法访问本站
本页面需要浏览器支持(启用)JavaScript
了解详情 >

一. 软件环境

Git

Node.js

Clash for Windows(任意加速器,保证能连接到Github)

1.1 Git官网

我们会将搭建好的Hexo上传到Github,所以需要Git命令行支持。

1.2 Node.js

如果你的网络无法进行下载,请访问以下链接进行下载:

1.3 检查安装是否成功

打开cmd命令行,输入node -v后显示下图所示,即为安装成功

在电脑的任意目录点击右键,能够显示Git Bash Here
使用这个功能可以更方便的在当前目录启动命令行,当然你也可以使用cmd的cd命令到当前目录

二. 博客本地化部署

2.1 更改npm为cnpm源

国内某些网络环境访问npm会出现问题,建议使用taobao镜像源,能有效减少故障的发生

切换npm源
1
npm install -g cnpm --registry=https://registry.npm.taobao.org

使用cnpm -v后正常输出版本号,即为安装成功

2.2 安装hexo命令行

-g是对全局安装hexo命令行

安装Hexo命令行
1
cnpm install hexo-cli -g

2.3 Hexo博客初始化

选取一个想要安装Hexo的目录,路径中最好不要含有中文,后续会更好处理

Hexo初始化命令
1
hexo init

此时文件夹内应有初始化文件,不过只要接下来能够成功运行,上述过程没有报错,就没问题。

如果初始化出现问题,即在运行hexo init的时候报错(通常是由于网络而出现问题)

如果出现网络问题导致无法下载,请访问以下链接获取基础包:

2.4 运行博客

在博客根目录右键打开Git Bash Here

输入以下指令

Hexo初始化命令
1
hexo clean && hexo g && hexo s

hexo clean 清除已经部署的网页静态文件

hexo g 编译当前博客

hexo s 启动本地服务器

出现Hexo is running at http://localhost:4000/ . Press Ctrl+C to stop.,并且没有后续的警告语句,说明部署成功,在浏览器中输入localhost:4000查看部署效果。

如果你的端口4000被占用,可以使用hexo s -p 端口号。然后访问http://localhost:端口号

以上,博客的最基本的本地化部署已经完成,接下来的内容是将博客部署到网络进行在线访问。

三. 博客部署到网络

基本介绍一下目前不同部署方式的差别。

Github:微软旗下的开源代码托管平台,国内某些运营商可能无法访问,一般来说还是推荐部署在Github Pages,这也是我本人目前主要用的服务。

Gitee:虽然是国内的代码托管平台,访问速度可以保证,但是它的Pages页面需要手动更新,并且不能够绑定自定义的域名(如果你想和别的博主交换友链,最好还是要有一个域名。因为一般有域名的博客更有动力维护下去)。

Coding:部署方式很复杂,新版的Coding Pages貌似是和腾讯云挂钩,按量付费,感觉没必要了。

Vercel:是一个静态网页部署平台,好像访问速度要比Github稍微快一些,并且提供修改自定义域名。

云服务器:访问速度很大程度上取决于你的服务器的带宽,而且现在服务器的价格也不便宜,以后部署其他需要服务器的项目时再使用比较好。

3.1 部署到Github(推荐)

3.1.1 创建Github仓库

注册完成Github账号,新建仓库用于保存上传博客代码。

Github账号注册时尽量不要使用国内邮箱,尤其是QQ邮箱

这里我已经存在该仓库,所以会爆红

Tips:试试新建一个仓库名为你Github用户名的仓库

按照图示修改好仓库名后,确保仓库为公开(Public),其他设置按需更改,创建仓库。

3.1.2 获取与Github的连接

在任意位置打开Git Bash Here,输入以下指令

建立与Github的连接
1
2
3
git config --global user.name "你的GitHub用户名"
git config --global user.email "你的GitHub注册邮箱"
ssh-keygen -t rsa -C "你的GitHub注册邮箱"

输入第三个命令后只需要连续按下三次回车,就会在C:\Users\用户名\.ssh中生成密钥文件

打开id_rsa.pub,复制文件内容,添加到

然后在Git Bash中输入以下命令测试是否连通Github

测试与Github的连接
1
ssh -T git@github.com

3.1.3 上传博客到Github

首先在Git Bash中输入以下命令安装部署插件

安装hexo-deployer-git
1
cnpm install hexo-deployer-git --save

打开根目录下的_config.yml文件

config文件配置
1
2
3
4
5
6
# Deployment
## Docs: https://hexo.io/docs/one-command-deployment
deploy:
type: git
repo: 填入仓库连接
branch: master

repo 可以复制此处的链接

填好后在Git Bash中输入下列命令部署到Github仓库

部署到Github
1
hexo clean && hexo g && hexo d

此时访问https://Github用户名.github.io即可访问

3.1.4 绑定自定义域名

你可以自行选择域名提供商,购买完域名后,在域名解析里设置以下解析记录

解析记录简介

  • 主机记录:设置为@为泛解析,即访问域名为https://域名。如果想要设置为二级域名,请将主机记录设置为想要设置的名称,比如主机记录设置为hexo,即访问域名为https://hexo.域名

  • 记录类型:设置为CNAME,将域名解析到网址。因为Github建议将自定义域名以CNAME解析到Github用户名.github.io

然后在_config.yml中设置url为你解析的域名

最后再博客根目录/source下新建CNAME文件

文件内容为自定义的域名

3.2 部署到Gitee(备用方法)

3.2.1 创建Gitee仓库

部署到Gitee与部署到Github的流程相差很小,看一个就行。

3.2.2 获取与Gitee的连接

在任意位置打开Git Bash Here,输入以下指令

连接到Gitee
1
2
3
git config --global user.name "你的Gitee用户名"
git config --global user.email "你的Gitee注册邮箱"
ssh-keygen -t rsa -C "你的Gitee注册邮箱"

输入第三个命令后只需要连续按下三次回车,就会在C:\Users\用户名\.ssh中生成密钥文件

打开id_rsa.pub,复制文件内容,添加到

然后在Git Bash中输入以下命令测试是否连通Gitee

测试连接
1
ssh -T git@gitee.com

3.2.3 上传博客到Gitee

首先在Git Bash中输入以下命令安装部署插件

安装hexo-deployer-git
1
cnpm install hexo-deployer-git --save

打开根目录下的_config.yml文件

config文件配置
1
2
3
4
5
6
# Deployment
## Docs: https://hexo.io/docs/one-command-deployment
deploy:
type: git
repo: 填入仓库连接
branch: master

repo 可以复制此处的链接

填好后在Git Bash中输入下列命令部署到Gitee仓库

部署到Gitee
1
hexo clean && hexo g && hexo d

在仓库的服务-Gitee Pages进行手动部署

Github Pages会自动使用你仓库的代码进行部署,而Gitee需要你手动更新。

打开强制使用Https,更新部署

等待部署结束后,访问Https://Gitee用户名.gitee.io查看部署结果

3.3 部署到Vercel

请在看过3.1部署到Github后再观看本部分教程。

3.3.1 连接Github仓库

项目名只能使用小写英文,无法使用大写英文,会报错

稍等一段时间后,Vercel便部署完成了你的博客

Vercel默认提供了域名,你也可以更改。
Settings-Domains中进行更改

写在最后

本篇文章基本讲述了Hexo博客的基本部署,包括了本地化部署测试和上传到Github,Gitee或是Vercel等平台,使用托管平台提供的Page服务进行远程访问。

本篇教程属于面向与小白的零基础教程系列,如果在安装过程中出现任何问题,你可以在评论区提问,你的提问也是我充实文章的助力!


文章来源于上杉九月的博客(Hexo_01-博客的安装与部署 - 九月的生活 (sakurasep.site))

评论