hexo搭建个人博客的过程

使用Hexo搭建个人博客

最近闲着没有事情做，就想起来很久之前的想法—自己搭一个简单的个人博客，然后经过选择(其实就是菜)，用hexo作为一个个人博客的框架，以及使用Github page 来进行托管个人博客

这就是我的个人博客,可以进去瞧一瞧看一看 : 传送门
我使用的的是butterfly的主题，本来一开始是用next主题的，后来随便逛了一下，就被这个主题吸引住了，而且这个主题安装文档也特别详细，下面我就说下我搭建的过程吧(面向windows)

---

hexo的简单搭建和部署到github

1.什么是Hexo?

Hexo 是一个基于Node.js快速、简洁且高效的博客框架。可以将我们撰写的 Markdown 文档解析渲染成静态的 HTML 网页,并生成静态网页托管在Github page上。

2.搭建步骤

1. 下载git：

windows ：到git官网上下载,下载完后会有一个Git Bash的命令行工具(用来使用git)。安装完可以在命令行窗口输入git --version查看版本

2. 下载node.js—毕竟是用node.js编写的

windows:Node.js官网,选择LTS就可以。安装完可以在命令行窗口输入node -v和npm -v查看版本

3. 连接github,创建SSH密匙，并且在github添加SSH密匙

之前写的git基础教程的链接本地仓库和远程仓库的方法

4. 验证连接

打开 Git Bash，输入 ssh -T git@github.com 出现 “Are you sure……”，输入 yes

5. 创建一个github仓库

仓库名字一定要输入用户名.github.io这样才能识别，不然可能出错，并且勾选 “Initialize this repository with a README”

6. 安装hexo
   选择一个合适的位置，创建一个文件夹例如blog,鼠标右键然后点开git bash,输入：

npm install -g hexo-cil

7. 进行初始化hexo和安装组件:

hexo init blog
cd blog
npm install

8. 然后使用hexo g进行生成静态网页，hexo server 进行预览:

浏览器访问 http://localhost:4000
如果出现页面加载不出来，可能是端口被占用了。Ctrl+C 关闭服务器，运行 hexo server -p 5000 更改端口号后重试。

这样Hex的本地博客安装成功就安装完了,下面我介绍一下初始化后生成的文件:

• source：存放文章
• themes：存放主题
• scaffolds：生成文章的一些模板
• node_modules: 依赖包
• public：存放生成的页面
• _config.yml: 博客的配置文件

9. hexo 部署到Github page
   • 安装部署命令：

     npm install hexo-deployer-git --save

   • 修改站点配置文件_config.yml,修改如下:

     deploy:
     type: git
     repository:git@github.com:用户名/用户名.github.io.git
     branch: master

   • 完成后再git bash 允许 git deploy就可以把网站部署到GitHub Pages，你就可以使用http://用户名.github.io来看我们的个人博客了。

---

3.绑定个人域名

如果感觉github的子域名不好看，那么你就可以去绑定自己的域名替换 GitHub 域名。我使用的是 阿里云 买的域名。
你如果购买域名后，就可以再域名控制台中，看到你购买的域名，然后点击解析

参考文章链接：https://blog.csdn.net/heimu24/article/details/81159099

---

hexo配置–根目录下的_config.yml文件

参考资料 : hexo 官方配置文档

其中一些我认为要理解的词语:

• description:主要用于SEO，告诉搜索引擎一个关于您站点的简单描述，通常建议包含网站的关键词。
• permalink:文章的永久链接格式 (有三个参数，默认就好)
• 在permalink到theme之间的配置默认就好，你如果感兴趣也可以对照着官方配置文档进行一定的修改
• theme：主题可以在hexo官网查找，下载放在theme文件夹下，再修改这个参数就可以改变主题了

Front-matter（是文件最上方以 — 分隔的区域，用于指定个别文件的变量）

参考资料 ：hexo 官方front-matter参数文档

布局(layout)

hexo有三种默认布局：post、page 和 draft，它们分别对应不同的路径，而您自定义的其他布局和 post 相同，都将储存到 source/_posts 文件夹。

1. 使用post(默认)

   hexo new [layout] (title)
   你可以在_posts文件夹上看到你产生的文件

2. 使用page(另起一页)

   hexo new page tag
   系统会自动在source文件夹下创建一个tags文件夹，以及tag文件夹中的index.md，这样你访问的tag对应的链接就是http://xxx.xxx/tag

3. 使用draft(草稿,想写文章，又不希望被看到)

   hexo new draft newpage

   系统会自动在source/_draft中新建一个newpage.md文件，如果想要预览一下，那么可以使用命令,然后再本地端口中开启服务预览:

   hexo server --draft

   如果想要发表到post去，输入：

   hexo publish draft newpage

---

更换主题

hexo主题网站 : 😄 https://hexo.io/themes/ 😄
我使用的是butterfly主题,这是他的安装文档：hexo-theme-butterfly安裝文檔，如果你也喜欢这个主题的话，你可以直接跟着安装文档进行布局就可以了，非常详细的。不过如果你使用的是别的主题的话，你就可以查阅该主题的安装文档，边阅读边进行配置。hexo的主题的基础配置基本上都差不多的，如果有遇到什么有问题的可以使用百度或者google等浏览器，也可以告诉我一声，可能我还意识到这个问题。最后，我们要始终相信办法总会比困难多的😄，一起加油！！！

---

###附加一些参考资料

• hexo+github+coding 搭建个人博客
• hexo史上最全搭建教程
• hexo博客添加搜索功能
• 使用 GitHub 分支保存 Hexo 环境和博文