安装Hexo

安装Hexo，需要依赖Node.js和Git这两个东西，这里提供了目前在Hexo使用稳定较新的版本，请先点击下载安装。

安装上边的两个软件之后，接下来在终端命令行执行下边的命令（Windows的CMD窗口）安装Hexo

npm install -g hexo-cli

建站

初始化Hexo工作的目录，你的站点文件也会在这里面：

  1. 先找一个合适的目录
  2. 使用命令行切换到这个目录，可以使用Shift+鼠标右键选择”在此处打开PowerShell窗口”。
  3. hexo init <folder>，将<folder>替换为你要创建的文件夹名称，初始化该目录。约定一下，之后我就用<folder>代表这个你新建的目录了。
  4. cd <folder>进入该目录，其实这时候已经可以运行了。但是稳妥起见，还是先执行完下一步。
  5. npm install安装Node的依赖模块，就是文件夹node_modules中的东西，是Hexo的一些依赖模块。

安装完成以后，先来简单看看这个目录有什么：

  1. _config.yml，这个就是网站的配置信息了，网站的标题之类的。以及之后我们要设置主题、设置外网托管(部署)都是在这里。
  2. source，源目录，你的文件就是保存在这里面的，你的主题会根据你的源文件，生成统一样式的界面。
  3. themes，主题。刚安装完Hexo只有一个landspace，这是默认主题。怎么换主题我们之后再说。

运行一下试试看：

命令行定位到<folder>位置，输入hexo s -g，这个命令的意思是，先(-) 执行 生成(g) 再 启动服务器(s)。就可以在浏览器打开localhost:4000。

写篇文章

这里不推荐官方的那种了，说说我平时怎么用的吧。

还记得之前分析目录时提到的那个source目录么，就是<folder>/source，打开它之后能看到一个_posts目录，打开_posts，我们就在这里面编辑文件（写、改、删）了。

在这里面，你可以写Markdown、HTML都可以，你的主题会根据你的内容生成样式丰富的文档。但是和一般的Markdown、HTML不一样的是，在文件的开头需要配置一些东西。打开你的Hello-world.md文件看一看，它的开头有这样一些东西。

1
2
3
---
title: Hello World
---

上面的内容就是说，我这篇文章，发布的时候，标题(title)是Hello World。这里注意一个细节，你的文件标题其实是Hello-world。发现了么？它是按照你的配置信息去生成最终文档的。

这里划个重点，不管是修改_config.yml，还是在这里，选项值(比如这里的Hello World)前面 必须加空格！ 你可以把空格去掉试试看。

贴一个我一般使用的配置项，配置名字、时间、还有多个标签：

1
2
3
4
5
6
7
8
9
---
title: 关于Socket
date: 2018-01-12 20:11:00
tags:
- 计算机网络
- Socket
- C#
- Python
---

更多详细的配置信息可以查看Hexo文档/Front-matter。

换个主题

首先，获取NexT主题

目的是将NexT主题放到<folder>/themes文件夹下，和landscope平级。

在命令行输入以下指令

1
2
cd <folder>
git clone https://github.com/iissnan/hexo-theme-next themes/next

现在你的themes文件夹下应该有了一个next文件夹，接下来我们就来使用它。

接下来，应用NexT主题

打开<folder>目录下的_config.yml，找到theme: landscope条目，将landscope换成next，即刚才创建的目录名（注意分号后跟空格）。最终就是theme: next这样。

现在，我们重新生成并启动服务器：

hexo s -g

其他还有butterfly主题
1
git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly

外网访问

github.io是很出名很好的选择，但是在我看来，对大部分人来说coding.me或许是更好的选择。Coding处于国内，网络访问比起Github也要顺畅很多。

也可以两个一起用，我刚开始就是这样的，但是后来发现使用github.io完全没必要，并且后边如果需要提交站长平台或是做统计，还要做针对性的工作。我就放弃了github.io。另外那种说国外访问github.io，国内访问coding.me，对我来说，国外访问coding.me无非多了几十毫秒的延迟。另外，还有一个小问题，真的有外国人看你的中文博客么……

所以，我这次就使用Coding做演示，我也建议你使用Coding。如需要使用Github，这一块也可以查一下别的教程。网上已经有大量的Github Pages的内容。

Coding Pages

注册

首先，去Coding注册一个账号。这里需要注意的是起名字，如果之后不打算买域名的话，就要使用{yourname}.coding.me这样的域名了。

创建项目

参考自Coding Pages

  1. 点击「创建新项目」
  2. 项目起名{yourname}.coding.me，并勾选「使用README.md初始化项目」
  3. 通过仓库中的「Pages 服务」菜单进入设置页面，在部署来源中选择「master 分支」，保存后您的 Pages 已启动运行
  4. 这时打开{yourname}.coding.me，会是404页面，因为仓库里什么都没有。这时如果在仓库根目录添加一个index.html，再次打开网址就是显示的这个页面了。(仓库更新后有延迟，多刷新几遍)。

这里我们就不用自己去写网页了，我们把自己刚才使用Hexo搭建的网站，想办法搬到{yourname}.coding.me(其实就是放到你的仓库中去)就可以了。称为Hexo部署。

Hexo部署

我们先设置一下部署选项，把Coding的信息添加到配置中。还是在那个配置文件里，_config.yml

文件最后面有deploy这一项，如果没做修改的话，它是这样子的

1
2
deploy:
  type:

空空如也，我们做一下修改：

1
2
3
4
5
deploy:
  type: git
  repository:
     coding: {address}
  branch: master

把{address}替换成你的仓库地址就可以了。

修改完毕，保存，接下来我们使用一条命令，生成并部署：

hexo d -g

这条命令的意思是：先(-) 执行 生成(g) ，之后执行 部署(d)

如果遇到了这个错误：

ERROR Deployer not found: git

这是因为需要安装一个模块hexo-deployer-git，用于git的部署，需要执行的命令是

npm install hexo-deployer-git –save

安装完毕，我们再尝试部署。

这次会弹框，让你输入你的账号名和密码。

都没问题的话最后会显示：

INFO Deploy done: git

这时，你再去Coding的网站打开你的仓库，就会发现一大堆东西，都是Hexo自动帮你创建的。

另外，这也就意味着，你可以打开{yourname}.coding.me查看效果了。

用自己的域名

域名推荐直接使用CNAME解析，并在根目录下放入CNAME文件

写入自己的域名。

关于HTTPS和HTTP

注意到「Pages 服务」页面有一个「强制HTTPS访问」，建议启用。

启用后有时候会遇到一个问题，就是如果要引用外站的非HTTPS(http)资源(图片什么的)会被拒绝。解决方法就是把这个资源换成HTTPS的，或是资源下载下来，放到仓库中或者图床(专门放置图片的)等地方再使用。

日常使用流程

  1. 打开<folder>/source/_post
  2. 写一个HTML或Markdown
  3. 在文本开始的位置前面加上title、tags、date等信息
  4. 回到<folder>目录
  5. 执行hexo s -g，生成并在localhost:4000查看效果。确保没问题，有问题再改。
  6. 执行hexo d部署到云端。

命令

创建目录和初始化这些东西，刚开始的时候用一次，之后就基本用不到了。

日常常用的命令大概有这些：

hexo g -> 生成
hexo s -> 启动本地服务器，可以在localhost:4000来做个预览
hexo d -> 部署到云端，可以外网访问

最重要的是我们之前演示过的组合使用：

hexo s -g -> 先生成，再启动服务器，用于修改后的预览
hexo d -g -> 先生成，再部署到云端

写的比较匆忙，如果有疑问或是建议，非常欢迎告知，我会及时修改。谢谢你的阅读，希望能有所帮助。