使用 hexo 建站流程

发表于 | 分类于
一、参考文章：
  1. next 主题文档：http://theme-next.iissnan.com/getting-started.html
  2. hexo 文档：https://hexo.io/zh-cn/docs/](https://hexo.io/zh-cn/docs/h
  3. https://www.jianshu.com/p/21c94eb7bcd1
  4. https://winney07.github.io/tags/Hexo/
二、github 配置、修改为 next 主题
三、页面发布

  1. 发布到 4000 端口： hexo s
    在http://localhost:4000/查看

  2. 发布到 github ：

    • hexo clean
    • hexo g
    • hexo d
    • 或 hexo clean && hexo g && hexo d

    在https://yangml6.github.io/查看

四、创建“分类”、“标签”页面

  1. 新建“分类”页：hexo new page categories

  2. 给分类页面添加类型：
    vim source/categories/index.md 在它的头部加上type属性

    1
    2
    3
    title: 分类
    date: 2019-07-12 11:32:32
    type: "categories"

  3. 给模板添加分类属性：
    vim scaffolds/post.md 给它的头部加上categories，这样我们创建的所有新的文章都会自带这个属性，只需要往里填分类，就可以自动在网站上形成分类，tags 同理

    1
    2
    3
    title: {{ title }}
    date: {{ date }}
    categories:

  4. vim /hexo/themes/next/_config.yml 打开 menu 部分对应

  5. 创建效果

五、新增一篇文章
  1. 在 /hexo目录下，进入Git Bash命令窗口中，输入hexo new "个站简介"
  2. 在 /source/_posts/下，可以看到已经生成了标题为个站简介.md的博客文件
  3. 对此文件进行编辑，Markdown 基本语法：文档
  4. 给文章添加分类和标签
  • 在 .md 文件中设置 categories 和 tags 属性：
    1
    2
    3
    4
    5
    6
    title: 个站简介
    date: 2018-08-02 11:41:10
    categories: 日常工具
    tags:
    - 随笔           //多个标签可以这样添加
    - hexo
  1. 添加“阅读全文”按钮

  • 方法一：在文章任意位置添加< !--more-->即可，去掉空格

  • 方法二：设置首页文章以摘要形式显示，打开主题配置文件，修改auto_excerpt：

    1
    2
    3
    auto_excerpt:
      enable: true
      length: 150

    length代表显示摘要的截取字符长度

六、在博文中添加图片
  • 方法一：
  1. 在hexo目录下，安装插件：
    npm install hexo-asset-image --save
  2. 在hexo\source 目录下新建一个img文件夹，把图片放置在里面；
  3. 在xxx.md文件中引用图片：
    ![header](/images/header.jpeg)
  • 方法二：
  1. 在全局配置文件（hexo/_config.yml)中将post_asset_folder设置为true；
  2. 创建文章（在创建的时候，会在hexo/source/_post目录下，生成一个XXX.md文件和一个XXX的文件夹）：
    hexo new "XXX"
  3. 把XXX这个博文需要展示的图片放在XXX文件夹目录下；
  4. 在XXX.md文件中引入图片的方式：
七、常见问题
  1. hexo 发布到 github 时报错：”FATAL Something’s wrong. Maybe you can find the solution here: https://hexo..."
    主要问题是找不到git分支，使用git init生成git文件夹，再发布即可