搭建个人Github+Hexo博客(中)

什么是Hexo?

Hexo 是一款快速、简单且功能强大的博客框架。您可以使用Markdown(或其他标记语言)撰写帖子,Hexo 可在几秒钟内生成具有精美主题的静态文件。

安装框架

安装前置

下载并安装 git

安装 Node.js

使用 Node.js 官方安装程序时,请确保勾选 Add to PATH 选项(默认已勾选)

安装Hexo

所有必备的应用程序安装完成后,即可使用 npm 安装 Hexo

npm install -g hexo-cli
进阶安装和使用

对于熟悉 npm 的进阶用户,可以仅局部安装 hexo 包
npm install hexo
到此,Hexo框架就搭建完成了

参阅 https://hexo.io/zh-cn/docs/ 原文链接

建站

现在,我们可以开始建设个人博客了

在刚刚搭建的文件夹,使用git(右键文件夹内部)输入以下指令:

1
2
3
hexo init <folder>
cd <folder>
npm install

(folder是文件夹名称,随便填,以后的工作都是在里面展开)

现在,你应该能看到你创建的文件夹

初始化后,您的项目文件夹将如下所示:

1
2
3
4
5
6
7
8
.
├── _config.yml
├── package.json
├── scaffolds
├── source
| ├── _drafts
| └── _posts
└── themes

_config.yml

网站的 配置 文件。您可以在此配置大部分的参数。

package.json
应用程序的信息。EJS, Stylus 和 Markdown 渲染引擎 已默认安装,您可以自由移除。如果您想,可以稍后卸载它们。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
package.json
{
"name": "hexo-site",
"version": "0.0.0",
"private": true,
"hexo": {
"version": ""
},
"dependencies": {
"hexo": "^7.0.0",
"hexo-generator-archive": "^2.0.0",
"hexo-generator-category": "^2.0.0",
"hexo-generator-index": "^3.0.0",
"hexo-generator-tag": "^2.0.0",
"hexo-renderer-ejs": "^2.0.0",
"hexo-renderer-stylus": "^3.0.0",
"hexo-renderer-marked": "^6.0.0",
"hexo-server": "^3.0.0",
"hexo-theme-landscape": "^1.0.0"
}
}

scaffolds

模版 文件夹。当您新建文章时,Hexo 会根据 scaffold 来创建文件。

source

资源文件夹。是存放用户资源的地方。除 _posts 文件夹之外,开头命名为 _(下划线)的文件 / 文件夹和隐藏的文件将会被忽略。Markdown 和 HTML 文件会被解析并放到 public 文件夹,而其他文件会被拷贝过去。

themes

主题 文件夹。Hexo 会根据主题来生成静态页面。

参阅 https://hexo.io/zh-cn/docs/setup 原文链接

至此,你成功建立了属于你的个人博客🎉🎉🎉

But……?

现在只是有了文件,但并不可视化(我也不知道这个词是不是这么用的),要想让其他人能看到我们的博客,我们需要配置域名和服务器

我使用的是GitHub提供的免费域名+仓库(我这里是乱写的,不喜勿喷)

获取GitHub域名仓库

首先你得有应该GitHub账号,注册我就不多说了,国网有可能进不上去,建议开魔法

(提示:如果你是第一次注册,名称记得取个好看/好听/好记的名字,因为这是我们的域名的一部分)

在注册完账号后,点击右上角的“+号菜单”里的alt text,创建你的仓库

随后来到 Create a new repository 界面,alt text栏填写你创建的账号名字.github.io,必须按照这个格式写,否则为普通仓库,

alt text

这一栏如图选择,

alt text

这一栏不选择,如图所示,最后点击alt text就ok了

于是乎,你的域名+仓库就有了,免费的!图片

配置网站

在主目录(即你创建的博客文件夹)的 _config.yml 文件中配置网站,配置选项可在 https://hexo.io/zh-cn/docs/configuration 处查看,主要有

alt text

这些选项

命令

接下来是一些常用命令,可在 https://hexo.io/zh-cn/docs/commands 查看

常用命令有

alt text

alt text

alt text

alt text

alt text

这些

结束……?

使用

hexo new post 你的标题
(这里的标题是文件名,建议用英语,空格用 - 代替) 写几篇posts后,

在git使用命令

hexo g -d
(生成静态文件,在生成完成后部署)就可以在之前的域名看到自己的博客了!🎉🎉🎉(在一两分钟后,部署也需要时间)

这篇就先写到这里吧,后面会再找时间出一些拓展功能,可以去我的网站https://mmzyc.github.io/ 看看(虽然都不常更新)

本文到现在统计时已有1438字,实在肝不动了,写了至少一小时,以后更新内容不定,可以在评论区留言,请大家多多支持,多多鼓励一下,谢谢了!

我们下篇教程再见~

BY 木锦棉棉