Hexo-blog搭建工具

1. Hexo简介

1.1. hexo作用

Hexo 是一个快速、简洁且高效的博客框架，利用 Markdown 即可自动生成静态网页。

  1. 超快速度
  • Node.js 所带来的超快生成速度，让上百个页面在几秒内瞬间完成渲染。
  1. 支持 Markdown
  • Hexo 支持 GitHub Flavored Markdown 的所有功能，甚至可以整合 Octopress 的大多数插件。
  1. 一键部署
  • 只需一条指令即可部署到 GitHub Pages, Heroku 或其他网站。
  1. 丰富的插件
  • Hexo 拥有强大的插件系统，安装插件可以让 Hexo 支持 Jade, CoffeeScript。

1.2. 相关网址

  1. 安装 ``` npm install hexo-cli -g
  2. 2. 初始化

hexo init blog cd blog npm install

  2. 3. 启动

hexo server

或者简写：

hexo s

  2. 4. 访问
  4. 打开`localhost:4000`即可打开默认的博客主页
  5. ## 3. Hexo 项目结构文件介绍

$ ll total 125 -rw-r—r— 1 R 1049089 1846 十二 18 14:12 _config.yml -rw-r—r— 1 R 1049089 21622 十二 18 14:15 db.json drwxr-xr-x 1 R 1049089 0 十二 18 14:15 node_modules/ -rw-r—r— 1 R 1049089 447 十二 18 14:15 package.json drwxr-xr-x 1 R 1049089 0 十二 18 14:12 scaffolds/ drwxr-xr-x 1 R 1049089 0 十二 18 14:12 source/ drwxr-xr-x 1 R 1049089 0 十二 18 14:12 themes/

  2. - `_config.yml`：博客主要的配置文件；
  3. - `node_modules`：NodeJs的依赖模块；
  4. - `scaffolds`：提供了三种不同的文章模版；
  5. - `source`：博客文章默认所在的目录；
  6. - `themes`：博客主题目录，默认：landscape；
  7. ## 4. 使用说明
  8. ### 4.1. 创建文章
  9. 创建文章。输入以下命令。这样默认为 post 文章，或者直接复制草稿模板至 source/_posts 目录

hexo new “My New Post”

  1. 注：
  3. 1. post是默认的layout，title是新post的md文件名和url对应地址。
  4. 1. title不要带空格，如果有空格，创建文件的时候文件名只会是最后一个空格后面的文字。它将会用在该post的url中，而且如果`_config.yml`中的post_asset_folder true（是否生成与每篇文章对应的资源文件夹，默认值为false），资源文件夹也会直接使用title值，所以建议最好使用英文来创建。真正的文章题目可以在md文件中修改。
  5. 1. post创建成功后，在 `/source/_posts` 文件夹下，会生成一个新的markdown文件，文件名就是你刚刚的title。
  6. #### 4.1.1. 添加分类及标签
  7. 参考网址：[https://www.jianshu.com/p/e17711e44e00](https://www.jianshu.com/p/e17711e44e00)
  8. ### 4.2. 生成静态网页

hexo generate

或者使用简写：

hexo g

  1. 这样就能在博客目录生成一个 public 目录。

$ ll total 12 drwxr-xr-x 1 R 1049089 0 十二 18 14:40 2018/ drwxr-xr-x 1 R 1049089 0 十二 18 14:40 archives/ drwxr-xr-x 1 R 1049089 0 十二 18 14:40 css/ drwxr-xr-x 1 R 1049089 0 十二 18 14:40 fancybox/ -rw-r—r— 1 R 1049089 6660 十二 18 14:40 index.html drwxr-xr-x 1 R 1049089 0 十二 18 14:40 js/

  1. 如需要重新生成可以执行一下清理命令

hexo clean

  1. ### 4.3. 发布到服务器
  2. 如果使用了 Github 的 Pages 托管服务，那么需要配置 _config.yml 中的如下配置

deploy: type: git repo:

  1. - git@github.com:MooNkirA/MooNkirA.github.io.git

branch: master

  1. 然后使用发布命令

hexo deploy

  1. 如果使用云服务器，将静态服务器的主目录设置为 public 这个目录即可
  2. ### 4.4. 切换主题
  4. - 在 Hexo 的主题网站下载一个自己的主题，如选择主题是`icarus`。下载之后把它扔到`themes`目录，然后修改根目录的配置文件`_config.yml`中的默认主题即可。
  5. - 目前选择的主题：
  6. - https://github.com/fan-lv/Fan（暂时无法使用）
  7. - [https://github.com/AlynxZhou/hexo-theme-aria/blob/master/README.zh_CN.md](b7619c4e2fcc5fb242fae6c5486ba382)

theme: Fan

  1. 也可以进入主题目录对这个主题进行自定义修改。
  2. ## 5. 问题
  3. ### 5.1. 在执行 `hexo deploy` 后,出现 `error deployer not found:github` 的错误
  4. 尝试使用hexo搭建github pages，本地调试没什么问题，但是最后部署时报“error deployer not found:github”的错误，到网上原因，发现是hexo的版本升级导致的。<br />**解决方案**
  6. - 步骤一
  8. 安装依赖插件

npm install hexo-deployer-git —save

  2. - 步骤二
  4. 修改_config.yml，deploy的type由github改为git

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

  2. - 步骤三
  4. 重新部署`hexo deploy`
  5. ### 5.2. hexo引用本地图片无法显示
  6. [https://blog.csdn.net/xjm850552586/article/details/84101345](https://blog.csdn.net/xjm850552586/article/details/84101345)
  7. ## 6. HEXO常用命令
  8. ### 6.1. 单条指令

hexo new “postName” # 新建文章 hexo new page “pageName” # 新建页面 hexo clean # 清除之前 public 文件夹的内容 hexo generate # 生成静态页面至public目录 hexo deploy # 将.deploy目录部署到GitHub hexo server # 开启预览访问端口（默认端口4000，’ctrl + c’关闭server） hexo help # 查看帮助 hexo version # 查看HEXO的版本

  1. ### 6.2. 简写指令

hexo n #等于hexo new hexo g #等于hexo generate hexo d #等于hexo deploy hexo s #等于hexo server hexo v #等于hexo version

  1. ### 6.3. 复合指令

hexo deploy -g #生成加部署 hexo server -g #生成加预览 hexo d —g 或者 hexo g —d #生成加部署

```