Hexo使用说明

简介

Hexo是一款基于Node.js的静态博客框架，依赖少易于使用，再加上可以部署到Github上面，成为很多程序员首选的个人博客框架。

安装

Hexo依赖于Node.js，下载对应版本的Node.js运行环境安装
检查Node.js是否安装成功
node -v
检测npm是否安装成功
npm -v
安装Hexo
npm install -g hexo-cli
初始化博客
进入到自定义的空目录，输入
hexo init

部署到Github

1. 登陆Github并新建一个公开仓库，仓库名应该为：用户名.github.io
2. 安装Git

3. 设置Git，打开命令行，输入

   git config --global user.name "你的GitHub用户名"
   git config --global user.email "你的GitHub注册邮箱"

4. 生成ssh密钥
   ssk-keygen -t rsa

5. 进入用户目录的.ssh文件夹中查看id_rsa.pub文件，将其内容复制到Github 博客项目的Settings页面的Deploy keys页面

Hexo命令常见用法

编写博文

在命令行输入
hexo n "博客名字"
在blog根目录下的source文件夹中的_post文件夹中多了一个博客名字.md文件，然后使用Markdown编辑器进行编辑即可

预览

在命令行输入
hexo server
使用浏览器访问localhost:4000 即可预览博文效果。

常用命令

npm update hexo -g	                      #升级
hexo n "我的博客" == hexo new "我的博客"  #新建文章
hexo g == hexo generate                   #生成
hexo s == hexo server                     #启动服务预览，Hexo会监视文件变动并自动更新，无须重启服务器
hexo server -s                            #静态模式
hexo server -p 5000                       #更改端口
hexo server -i 192.168.1.1                #自定义IP
hexo d == hexo deploy                     #部署
hexo clean                                #清除缓存，若是网页正常情况下可以忽略这条命令

发布

写好博文并且样式无误后，在命令输入
hexo g
hexo d
生成、部署网页。随后可以在浏览器中输入域名浏览。

常见问题

如何创建Tags和Categories

1. 首先创建新的页面

   hexo new page "categories"
   hexo new page "tags"

2. 在source文件夹下分别修改相应的index.md文件，将页面的类型设置为 categories | tags
   categories/index.md

   ---
   title: 分类
   date: 2018-4-30 11:59:10
   type: "categories"
   ---

tags/index.md

---
title: 标签
date: 2018-4-30 11:59:10
type: "tags"
---

3. 修改scaffolds文件夹下面的文件
   scaffolds/draft.md

   title: {{ title }}
   tags: {{ tags }}

scaffolds/post.md

title: {{ title }}
date: {{ date }}
tags: {{ tags }}

如何引用图片

1. 本地绝对引用
   文章中只用到少量图片时，可以将图片统一放在source/images文件夹中，通过markdown语法访问它们。

   #图片路径
   source/images/image.jpg
   #Markdown引用语法
   ![](/images/image.jpg)

这样图片既可以在首页内容中访问到，也可以在文章正文中访问到。

2. 本地相对引用
   配置_config.yml
   post_asset_folder: true
   执行命令
   $ hexo new post_name
   在source/_posts中会生成文章post_name.md和同名文件夹post_name。将图片资源放在post_name中，文章就可以使用相对路径引用图片资源了。

   #图片路径
   _posts/post_name/image.jpg
   #Markdown引用语法
   ![](image.jpg)

但是图片只能在文章中显示，但无法在首页中正常显示。
如果希望图片在文章和首页中同时显示，可以使用标签插件语法。

#图片路径
_posts/post_name/image.jpg
#Markdown引用语法
{% asset_img image.jpg This is an image %}

3. 互联网引用
   申请了CDN或者图片床之后，直接将链接添加到文章即可

   Deployer not found: git

   在终端执行命令：

   npm install hexo-deployer-git --save

然后继续执行hexo deploye指令进行部署。

调整indigo主题适配宽屏

修改hexo-theme-indigo/source/css/_partial/variable.less

把@contentWidth: 960px;改成@contentWidth: 90%;

修改主题config文件cdn: false