学习目标

按照本文的步骤，可以快速的完成 hexo 的搭建，并且了解到以下一些知识点：

• Node.js 环境的搭建

• 了解 Hexo 的安装过程

• 了解基本的 hexo 命令，完成html等静态文件的生成和部署

• 在浏览器访问本地服务器

Hexo 简单介绍

Hexo 是高效的静态站点生成框架，她基于 Node.js。 通过 Hexo 你可以轻松地使用 Markdown 编写文章，除了 Markdown 本身的语法之外，还可以使用 Hexo 提供的 标签插件 来快速的插入特定形式的内容。在这篇文章中，假定你已经成功安装了 Hexo，并使用 Hexo 提供的命令创建了一个站点。

快速搭建

搭建 Node.js 环境

因为 Hexo 是基于 Node.js 的，因此第一步，我们需要安装 Node.js。在 Mac 可以直接使用 Homebrew 来安装，没有安装 Homebrew 的同学，可以去官网看看教程。

brew install node

安装 Hexo

npm install -g hexo-cli

对于Mac 用户,您在编译时可能会遇到问题，请先到 App Store 安装 Xcode，Xcode 完成后，安装 Command Line Tools 命令行工具。

初始化博客存放的目录

执行以下命令，Hexo 将会在指定文件夹中新建所需要的文件。

hexo init <博客存放的目录>
cd <博客存放的目录>
npm install

命令执行完毕之后，会在<博客存放的目录>目录下生成以下这些文件

.
├── _config.yml # 配置相关的文件
├── package.json #应用程序的信息
├── scaffolds # 模版 文件夹
├── source
|   ├── _drafts # 草稿，默认是没有这个文件夹的
|   └── _posts # 发布的文章存放的文件夹
└── themes # 主题相关的文件夹

清除缓存

清除缓存文件 (db.json) 和已生成的静态文件 (public)。

在某些情况（尤其是更换主题后），如果发现您对站点的更改无论如何也不生效，您可能需要运行该命令。

hexo clean

本地生成和部署

安装 hexo 之后，默认会在 source/_posts/ 生成一个 hello-world.md 文件，所以待会我们生成静态文件并部署之后就可以看到 hello-world 展示在我们的浏览器上了。

image

• 在 public 目录下生成静态文件，例如一些 html,css等文件。

以下命令就是将 source/_posts/下的文章(例如上面截图的 hello-world.md)在 publish 文件夹下生成静态的 html 文件。

hexo generate
or
hexo g

image

• 部署之前预先生成静态文件

hexo deploy
or
hexo d

这两个命令可以合并在一起写

hexo g -d

启动服务器。

部署完毕之后，就可以启动服务器进行访问了，默认情况下，访问网址为： http://localhost:4000/

hexo server
or
hexo s

如果在浏览器中出现以下页面就表示本地 Hexo 已经搭建完毕了。

image