一. 软件环境
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 | git config --global user.name "你的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 | # Deployment |
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 | git config --global user.name "你的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 | # Deployment |
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))