搭建自己的博客

在上大学之前,一直以来的梦想是拥有一台属于自己的电脑。这个梦想在步入大学生涯之后得以实现。然而不知不觉却失去了许多。比如,每当窗外大雨磅礴的时候,心也共鸣似的跟着天空哭泣。我曾经以为是我成熟了,终于摆脱了那种令人心情不快的忧郁,其实我是失去了对自己分析内心的能力,失去了用文字表达感情的习惯,失去了和TA交流心绪的机会。失去的已经永远的失去了,可我还能重新开始。我将以这一篇毫无技术含量的技术文章开始新的征程。

准备工作

官方文档

Node.js

Node.js下载地址
LTS为长期更新版本,Current为最新版本,看个人喜好了。下载完双击安装即可
Custom Setup这一步记得选择Add to PATH,可以自动配置环境变量。

Git

Git下载地址
下载完双击安装即可
建议选择最新版本,本人就因为Git的版本难问题,在Deploy的时候纠结了老半天,最后在Github上搜索到了原因——因为Github更新了Git版本,更新了Git就解决了(还是听从了官方的建议,遇到问题请时候用在Google或者Github上搜索,百度搜索技术问题是真的不靠谱)

安装Hexo

确保你已经完成了准备工作
以下是安装命令

1
$ npm install -g hexo-cli

或者

1
$ npm i -g hexo

iinstall npm命令的简写,hexohexo-cli的区别不是很清楚,就网上结果看来是都可以的

初始化Hexo

可以在指定目录中新建一个用来存放个人博客数据的文件夹,在该文件夹中右键点击Git Bush Here 然后使用命令

1
hexo init

或者使用命令

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

在指定文件夹中初始化

新建完成后,指定文件夹的初始目录如下

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

_config.yml

网站的配置信息,详细内容参考官方文档中的配置部分

package.json

应用程序的信息。其中EJS, StylusMarkdown renderer 为默认安装。可以根据需要增加或者删除

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
{
"name": "hexo-site",
"version": "0.0.0",
"private": true,
"hexo": {
"version": "3.6.0"
},
"dependencies": {
"hexo": "^3.2.0",
"hexo-generator-archive": "^0.1.4",
"hexo-generator-category": "^0.1.3",
"hexo-generator-index": "^0.2.0",
"hexo-generator-tag": "^0.2.0",
"hexo-renderer-ejs": "^0.3.0",
"hexo-renderer-marked": "^0.3.0",
"hexo-renderer-stylus": "^0.3.1",
"hexo-server": "^0.2.2"
}
}

scaffolds(模板)

当您新建文章时,Hexo 会根据 scaffold 来建立文件。

Hexo的模板是指在新建的markdown文件中默认填充的内容。例如,如果您修改scaffold/post.md中的Front-matter内容,那么每次新建一篇文章时都会包含这个修改。

source(资源)

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

themes(主题)

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

搭桥到Github

  • 新建一个Github账号
  • 创建一个repository(仓库),形如XXX.github.io,其中XXX为你的github名称
  • 配置Git环境
1
2
$ git config --global user.name "XXX" #设置全局用户名
$ git config --global user.email "XXX@example.mail" #设置全局邮箱
  • 创建SSH
    windows的命令行没有自带ssh工具,直接用GitBash比较方便。使用命令
1
$ ssh-keygen -t rsa -C "youremail@example.com"

根据生成信息,在对应文件夹中找到id_rsa.pub,在github中依次点击头像->settings->SSH and GPG keys->New SSH key,将文件的内容复制到github中。

本地发布

使用命令

$ npm i hexo-server

安装server模块

使用命令

1
2
3
$ hexo clean #清除相关文件
$ hexo generate #生成相关文件
$ hexo server #本地发布

进行本地发布,然后就可以在浏览器中输入http://localhost:4000看到本地版个人博客了

上传到Github

配置发布信息

在创建的博客文件夹中,打开 _config.yml,按照以下形式配置

1
2
3
4
deploy:
type: git
repo: https://github.com/XXX/XXX.github.io.git
branch: master

使用命令

npm install hexo-deployer-git --save

安装deployer-git模块

使用命令

1
2
3
$ hexo clean #清除相关文件
$ hexo generate #生成相关文件
$ hexo deploy #发布并上传

发布并上传,然后就可以在浏览器中输入http://XXX.github.io看到发布在Internet上的个人博客了!