这两天在尝试搭个人博客,最终效果如:BunnRecord,在这里记录下 win10 环境下的搭建过程。
内容主要分为七个部分:
- Hexo 简介
- 安装 GIT 和 Node.js
- 安装 Hexo
- 将博客部署到 GitHub 上
- 发表第一篇文章
- 切换 yilia 主题
- 设置个人域名
Hexo 简介
Hexo 是一个基于 Node.js 的快速、简洁且高效的博客框架,可以方便的生成静态网页托管在 GitHub 上。更多内容可以查看 Hexo官网 。
安装 GIT 和 Node.js
- GIT 是一个分布式版本控制系统,可以从这里了解:GIT 相关,下载 安装包 进行安装。
安装好后,在命令行输入git -version
查看版本。 - Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境,下载 LTS 版本 安装包 进行安装。
安装好后,在命令行输入node -v
和npm -v
查看是否安装成功。
如果出现(`node` 不是内部或外部命令,也不是可运行的程序或批处理文件),可以这样 解决 。
安装 Hexo
GIT 和 Node.js 安装成功后,就可以安装 Hexo 了。
-
新建一个 BLOG 文件夹,这个文件夹就是用来存放你的博客的所有文件,然后在 cmd 控制台打开这个文件夹。
相继输入以下命令:npm install -g hexo-cli (用于安装 Hexo) hexo init (用于初始化 Hexo) npm install(用于安装依赖包) npm install hexo-deployer-git --save (用于安装 deploy-git 插件)
-
一系列命令完成后,再在命令行输入
hexo g
+hexo s
,就能在浏览器的 localhost:4000 这个网址上看到你的博客了。
这时候 Hexo 已经安装好了(默认 landscape 主题,可以根据自己的喜好切换,参考后面有切换 yilia 主题介绍),而现在只能在自己本地查看博客,想让别人看到,还需要部署到 GitHub 上。
另外常用的 Hexo 命令:
hexo clean (清除当前项目的静态文件)
hexo g(hexo generate,生成静态文件)
hexo s(hexo server,启动服务器,本地可以测试)
hexo d(hexo deploy,将本地编译好的静态文件发布到github上)
hexo n(hexo new,新建一篇文章)
将博客部署到 GitHub 上
这部分不细说 GitHub 的使用 和 添加 SSH 密钥 了,还不会可以参考 从 0 开始学习 GitHub 系列 。
-
到 GitHub 上创建一个名为 xxxx.github.io 的公开个人仓库( xxxx 为你的 GitHub 用户名),以我的为例:
- 然后建立 Hexo 和 GitHub 仓库的关联,将博客的内容部署到 GitHub 上。
打开本地 BLOG 文件夹,打开_config.yml
文件(这个文件与博客的各种配置有关),找到URL
和deploy
进行修改,其中 YourgithubName 就是你的 GitHub 用户名。
url: https://YourgithubName.github.io/
root: /
deploy:
type: git
repo: https://github.com/YourgithubName/YourgithubName.github.io.git
branch: master
- 然后在 cmd 控制台中 BLOG 目录下(以后控制台输入命令行都是在 BLOG 目录下),输入以下命令:
完成后就能在 http://yourname.github.io 这个网址下看到你的博客了。hexo clean hexo g hexo d
发表第一篇文章
在 cmd 控制台,BLOG 目录下,输入 hexo new articlename
新建文章(articlename可以换),然后在文件 BLOG\source\_posts 里就能见到你的第一篇文章了。
这里注意要使用 markdown 语法和 markdown 编辑器,可以看 关于 markdown 了解 markdown 知识。
文章编辑完成后,控制台输入以下命令:
hexo clean
hexo g
hexo d
就能在博客里看到你的第一篇文章了。
PS:这里可以见到 hexo clean -> hexo g -> hexo d 这三条命令是非常常用的将本地内容推上 GitHub 推上网上博客的命令。
切换 yilia 主题
前面提到 hexo 默认的主题是 landscape,那么我们可以自己切换主题,我看了一下各种主题,个人比较喜欢 yilia 这个主题,这里就以 yilia 为例,记录一下怎么切换主题。
- 在 cmd 控制台 BLOG 目录下 ,输入
cd themes
读取到主题文件夹,然后输入git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia
下载 yilia 主题包。
- 接着打开本地 BLOG 文件夹,打开
_config.yml
文件,找到theme: landscape
,修改成theme: yilia
。
-
接着 cmd 控制台输入 hexo clean -> hexo g -> hexo d 三条命令。
部署完成后再去到网页上就能看到新主题啦。
设置个人域名
这一部分不是必须,就是如果你不想通过 http://yourname.github.io 这个网址访问博客,就可以自己设置个人域名,但是需要买域名。
我在 阿里云 上买了 bunnrecord.top
这个域名,实名认证过后就能在域名控制台进行相关配置了。
-
首先在 cmd 控制台输入
ping yourname.github.io
这条命令,找到你的博客的 IP 地址,复制下来。
-
在 购买域名的地方 打开域名控制台,解析域名并做如图配置。(记录值就是 IP 地址)
-
登录GitHub,进入之前博客仓库,点击settings,设置Custom domain,输入购买的域名
bunnrecord.top
。
然后在本地博客文件source中创建一个名为CNAME文件,不要后缀。写上域名。
在 cmd 控制台输入 hexo clean -> hexo g -> hexo d ,过一会就能在购买的域名上查看博客了。
最后
经过以上步骤,个人博客就基本搭好了,但还有很多的一些配置,放在下一篇来记录吧。
参考及鸣谢