基于Hexo和Github搭建个人主页

基于Hexo和Github搭建个人主页

搭建好个人博客之后的第一篇博客应该写什么呢?当然是如何搭建一个博客了!

该教程基于macOS 11.2.1(Big Sur),其中的部分命令不适用于windows

Node.js安装

安装Node.js https://nodejs.org/en/安装LTS版本即可。

Screen Shot 2021-03-20 at 2.20.10 PM

安装好之后打开终端,运行以下命令,检查一下是否安装完成。

1
2
3
sudo su #切换为root 用户
$ node -v
v12.16.3

可以看到Node.js的版本号为V12.16.13已经安装成功。(因为Node.js之前自己已经安装过了,所以和上面截图的版本不一样)。

接下来查看包管理器npm的版本,在终端中输入以下命令。

1
2
$ npm -v
6.14.8

到此安装Node.js步骤已经完成

安装Hexo框架

利用npm安装Hexo框架(在root用户下全局安装)

1
sh-3.2# npm install -g hexo-cli

如果因为dddd的问题无法使用npm安装,可以尝试切换成淘宝的cnpm进行安装。

同样的安装完成之后,我们使用以下命令验证一下。

1
sh-3.2# hexo -v

新建一个blog文件用于管理

首先使用pwd命令查看一下当前目录,然后在个人的目录下mkdir一个空文件夹

1
mkdir blog

这样就在个人目录下面建了一个名为blog的文件夹📂,用于后续的文件管理。

使用Hexo生成一个博客

使用hexo来初始化一个博客

1
sudo hexo init

运行上方的命令之后,就会自动初始化。

需要注意的一点是这个命令需要使用Git,如果之前没有安装Git,需要先装好,另外windows不用sudo,直接管理员打开即可。

**Start blogging with Hexo!**看到这一行说明已经初始化完成。

打开Finder查看一下刚刚创建的blog文件夹中生成了哪些文件。

以上都是Hexo自动生成的内容。(后面切换主题在themes文件夹内)

启动博客

运行以下命令就可以直接启动博客了。

1
hexo s

在localhost的4000端口启动,在浏览器进入对应的地址,就可以看到初始页面。

Hello world!

基于github部署博客

首先断开hexo服务,然后在github上部署个人博客。

在github的个人主页创建一个新的仓库需要注意的是作为个人主页的仓库名字主要是github的id加上.gihthub.io

在之前的blog文件下安装一个git部署的插件hexo-deployer-git

1
sh-3.2# npm install --save hexo-deployer-git

设置_config.yml文件中的内容

一般都用Vim打开文件进行编辑,但推荐使用Mac自带的textedit进行打开。

1
open -a  TextEdit _config.yml

直接拉到文件最后,有一个# Deployment进行配置。

配置成以下样式即可。

branch不指定默认也是master,这个问题不大。

使用 hexo d部署到远端,注意需要输入一下自己的github用户名和密码。注意repo是自己的地址

然后在github仓库中可以看到刚刚部署的博客。(在浏览器中直接访问仓库名,就可以看到部署好的博客了)

更换主题

在hexo中选择自己喜欢的主题,然后按照文档说明更换即可。

参考


本博客所有文章除特别声明外,均采用 CC BY-SA 4.0 协议 ,转载请注明出处!