关于Hexo的避坑指南

{% meting "2111364820" "tencent" "playlist" "theme:#FF4081" "mode:circulation" "mutex:true" "listmaxheight:200px" "preload:auto" "autoplay" %}

一.构建文件时无法生成index.html文件

部署到GitHub后主页空白出现如下字符:

extends includes/layout.pug block content include includes/recent-posts.pug include includes/partial

问题:一般为缺少hexo所需的插件,可通过查看 npm 安装各 hexo 插件的情况
npm ls --depth 0
1.查看是否缺少插件:

查看是否缺少插件

2.如图,我这里缺少 下面的五个插件,只需要把缺少的插件补上即可
npm i hexo-deployer-git --save
npm i hexo-browsersync --save
......
......

安装缺少的插件

3.安装好插件后再次检查一次是否安装完成

mark

4.再次构建,无问题后部署到GitHub上

mark

***解决此问题只需要逐个安装所缺的插件 ,全部安装好后再次构建即可.***

二.部署到GitHub后的自定义域名解析 (以阿里云为例)

1.首先找到阿里云控制台的域名解析页面

mark

mark

2.在解析中添加CNAME类型的记录 记录值为你GitHub的博客网址 ,如我的GitHub网址为 : Aealen.github.io

mark

3.在hexo的source目录中创建CNAME文件,没有任何后缀,用编辑器打开,在第一行填入域名

至于为什么在source文件夹,在 之前的一篇文章 中有说明.

这里以我的博客的域名为例:

mark

注意: 只能填一行

三.部署到github的配置文件中git需要加引号 'git' ,否则无法部署,此问题暂时只有我遇到,原因不明.

mark

把git打上引号即可

四.在友链link的index.md中添加type: "link"后构建出错,如图:

mark

1.首先排除是否没有安装pug以及 stylus渲染器.

如果你沒有pug以及stylus的渲染器,請下載安裝:

npm install hexo-renderer-pug hexo-renderer-stylus --save or yarn add hexo-renderer-pug hexo-renderer-stylus

确认安装

mark

2.根本问题还是没有在hexo\source下创建_data文件夹然后再创建link.yml文件,并再文件内添加友链.

mark

全部修改好后,再次构建检查无事后再部署.

注意: 注意格式,注意空格!!

五.修改card卡片颜色,也就是侧边栏和信纸的颜色,白色略过于单调

在 \hexo\themes\Butterfly\source\css\var.styl文件中找到 card-bg位置 后面修改颜色即可

mark

六.去除网页中超链接的下划线

  <style type="text/css">
    a:link,a:visited{text-decoration:none;  /*超链接无下划线*/}
    a:hover{text-decoration:underline;  /*鼠标放上去有下划线*/}
  </style>

在遇到问题后持续更新..........

Q.E.D.