Hexo 基础搭建

注意：如果出现图片不显示问题请移步 图片不显示问题

本文主要记载

搭建本地博客
部署到 Github Pages

1 2	本文环境是 win10 或 win 7。mac 再执行 npm 时需要在前面添加 sudo 本文整理于各大佬文章，文中会给出相应链接，如有侵权，请联系我修改或删除。

一、搭建本地博客

1.1 首先安装 `Node.js`

首先去官方页面下载安装文件，无脑安装就好（。）

图中绿色选择部分，安装完成后输入 npm -v , 会告诉你版本号，就证明你安装成功了

3.2 安装 Git

去 git官网下载电脑对应版本，进行安装，安装完成后，输入 git version ，会告诉你版本号，就证明你安装成功了。安装成功后，鼠标右键菜单里会多出 Git GUI Here 和 Git Bash Here 两个按钮。

Git安装教程这个是百度的，如果不会查看本链接或重新百度就好~

我管理代码都是在 Sourcetree 上进行，后续会说，当然也是要 Git 的支持，这个还是很方便的，无脑操作~6

1.2 安装 `Hexo`

*注意执行命令期间 WARN 不管只看 ERR *

在文件夹内如 D:\blog ，鼠标右键点击 Git Bash Here 一气呵成，来到了命令行界面。

首先安装 hexo

1	npm install hexo-cli -g

1.2.1 镜像相关（如果 npm 可以正常使用这里跳过！）

上面正常情况是没有问题的，但是由于国内访问官方 NPM 源速度较慢，为了一劳永逸，此处可以将 NPM 源更换为了淘宝 NPM 镜像源。
请注意!!，如果你觉得你的 NPM 源速度够快，更换镜像源这部分可选择性使用

在 Git Bash Here 中输入指令，将官方 npm 源更换为淘宝 npm 镜像源

1	npm install -g cnpm --registry=https://registry.npm.taobao.org

可以输入

1	cnpm config list

查看是否更换成功

请注意，如需使用上方安装的淘宝源，需要在使用 npm 命令时将其改为 cnpm，但是如果用了 cnpm 再使用 npm 的话，好像有点问题，npm 一直报 err 。所以这里给出卸载镜像的命令

1	npm uninstall cnpm -g

但是 npm 命令还是报错，还需要删除掉 C:\Users\<电脑名字>\AppData\Roaming 目录下 npm-cache 和 npm 文件，重新执行上面两个安装命令即可

1.3 Hexo初始化

安装完成后，输入 hexo -v 会输出 hexo 版本号，证明安装成功。

然后在当前目录新建一个文件夹，比如 D:\blog\hexos ，在此目录下鼠标右键点击 Git Bash Here 执行，这条命令需要一个空文件夹所以新建一个。

hexo init

完成后，文件目录如下

这样就证明初始化完成了，然后我们继续要生成静态页面，用到的命令是

hexo g

其中，g 的全称是 generate，当然也可以用 hexo generate 这条命令。

1	npm install hexo-server --save

然后就是运行了

hexo s

其中， s 的全称是 server，当然也可以用 hexo server 这条命令

然后，打开你的浏览器，输入http://localhost:4000/ 即可看到本地静态博客

本地静态博客完成 ~

如果出现 Cannot GET/xxx 等类似错误，意味着有文件未被找到。Cannot GET/xxx 错误本质是 hexo server 返回的一个404错误。

判断public目录下 xxx 文件是否存在。(我的错误是 Cannot GET/ ，因此在public目录下寻找 index.html 是否存在。)

如果说 index.html 不存在，那么执行 hexo clean，hexo g 重新生成一次，回到步骤1。

步骤2执行完后 index.html 仍不存在，执行 npm audit fix ，查看是否少了什么组件，通过 npm install hexo-xxx-xxx 安装即可。

步骤3完成之后，执行 hexo clean，hexo g 重新生成静态文件。

仍然有问题，请再参考此文：https://www.cnblogs.com/Sroot/p/6305938.html

感谢 Cannot GET 错误解决方式原文地址

二、部署到 Github Pages

2.1 注册Github账户

进入 github首页，点击右上角 sign up 进行注册。

2.2 创建项目

登录后，创建一个自己的 GitHub Pages。点击头像中的 New repository 。

*敲黑板！！这里重点就是项目名称必须是 自己名称.github.io *

2.3 配置 `SSH` 密钥

2.3.1 查看是否存在 `SSH` 密钥

首先通过输入命令

1	cd ~/. ssh

如果存在则会进入此目录,可以略过 4.3.2，否则会提示你不存在，那么继续 4.3.2

2.3.2 创建新的 `SSH` 密钥

1	ssh-keygen -t rsa -C "your_email@example.com"

这将按照你提供的邮箱地址，创建一对密钥，然后让你输入密码

1 2	Enter passphrase (empty for no passphrase): [Type a passphrase] Enter same passphrase again: [Type passphrase again]

如果你放心，可以不用密码，直接回车，这样每次提交的时候比较方便。

2.3.3 在 `GitHub` 添加你的公钥

首先拷贝公钥内容（ mac 可能用不了，需要手动找到这个文件复制内容）

1	clip < ~/.ssh/id_rsa.pub

然后登陆 GitHub ，点击头像

进入设置页，选择 SSH

粘贴密钥，添加即可

测试

1	ssh -T git@github.com

设置用户信息

Git 会根据用户的名字和邮箱来记录提交。

1	git config --global user.name "name"

1	git config --global user.email "email"

这样就配置好了SSH

2.4 将本地 `Hexo` 文件编译并上传 `GitHub` 的库中

打开 github首页登录，找到左上角自己的项目

点击 clone 点击 Use SSH 并复制 SSH 路径
打开 hexo 目录，找到 _config 文件
打开并找到 deploy 关键字

deploy:
  type: git
  repository: git@github.com:CalmCenter/calmcenter.github.io.git
  branch: master

注意: 引号后有一个空格，repository 填写 ssh 地址，branch 如果没有特殊要求，写master

编译并提交

部署前需要先装 deployer ，deployer 用于将 hexo 部署到 git page

1	npm install hexo-deployer-git --save

提交前，有时候提交了不生效，需要清理一下缓存

1	hexo clean

编译并提交

hexo g -d

和 hexo g 、 hexo d 一样

提交后线上会有延迟才会展现最新效果，特别是配置样式之后

提交过程中会让你输入一次密码，完成后就可以在外网访问博客了。https://calmcenter.github.io/ https://用户名.github.io

假如这时候，报错 ERROR Deployer not found: git，那么就是你的 deployer 没有安装成功，你需要执行如下命令再安装一次：

1	npm install hexo-deployer-git --save

这样，你再执行 hexo g -d ，你的博客就部署到 Github 上了。

本文主要记载

一、 搭建本地博客

1.1 首先安装 Node.js

1.2 安装 Hexo