0%

问题一

首先是在创建第一条中文post时,出现了上传到网页后,post内容出现了乱码的情况。

原因

这个问题出现的原因是由于创建的markdown文件的编码格式不是utf-8,而是ANSI。

解决方法

这个问题的解决方法是在创建markdown文件时,选择utf-8编码格式。如果已经创建了markdown文件,可以在vscode中,选择文件-首选项-设置,然后在搜索框中输入“files.encoding”,然后选择“utf-8”。或者使用记事本打开markdown文件,然后另存为,选择utf-8编码格式。

这一问题参考了:

Hexo解决中文乱码问题


问题二

发布的博客中的图片无法显示。显示出一个裂开的符号。

原因

创建markdown文件是,插入图片的语法是![图片名称](图片路径/图片名称.jpg),而图片路径是相对于markdown文件的路径,而不是相对于网页的路径。网页中是无法链接到电脑中的图片的。

解决方法

在这里可以使用hexo的插件hexo-renderer-marked,这个插件可以将markdown文件中的图片路径转换为网页中的图片路径。有一些解决方案使用使用的是插件hexo-assets-image,但是我在调试过程中安装又卸载了这个插件后,再次安装hexo-renderer-marked插件时,出现了错误,所以我选择了hexo-renderer-marked插件。

安装之后,需要在hexo的配置文件_config.yml中修改一些配置,具体如下:

1
2
3
4
post_asset_folder: true
marked:
prependRoot: true
postAsset: true

其中,post_asset_folder: true表示开启文章资源文件夹,marked表示使用marked插件,prependRoot表示在图片路径前面加上根路径,postAsset表示在图片路径前面加上文章资源文件夹路径。第二到第四行的配置是在hexo的配置文件_config.yml中自行添加的。

还要注意的是,使用这个插件后,markdown文件中插入图片的语法是![图片名称](图片名称.jpg),而不是![图片名称](图片路径/图片名称.jpg)。这个很重要,不然会出现图片无法显示的情况。使用这个语法后,编写markdown时图片是无法显示的,但是发布到网页后,图片就可以显示了。以及本地图片资源需要放在source文件夹下的post文件夹中的markdown文件同名文件夹中,而不是放在source文件夹下的images文件夹中。

如果觉得在编辑markdown文件时,图片无法显示很难受,可以考虑使用typora这个编辑器,这个编辑器可以在编辑markdown文件时,将图片显示出来。具体的设置可以参考hexo博客如何插入图片这一文章。

这一问题的解决方法还参考了一下方法:

[Hexo博客搭建]第4章 Hexo图片显示问题

Hexo博客样式问题填坑向第1弹(本地图片无法显示/Cannot GET xxx/背景图/文章目录索引

创建好了博客之后,就要开始写文章了,这里记录一下如何在hexo上创建一篇文章。

首先前提是已经创建了一个博客,以及了解了需要在博客关联的本地仓库的文件夹里调用GIT BASH HERE来创建文章。有关于如何创建博客,可以参考知乎上的这篇文章:从零开始搭建个人博客(超详细)

创建文章

在本地仓库的文件夹里调用GIT BASH HERE,输入如下命令:

1
hexo new "你的文章名"

调用GIT BASH HERE的方法如下图所示:

这是图片

在Git Bash里输入命令后,会在本地仓库的文件夹里生成一个markdown文件,会在source/_posts文件夹里生成一个markdown文件,如下图所示:

这是图片

编辑这个markdown文件,就可以开始写文章了。

Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub.

Quick Start

Create a new post

1
$ hexo new "My New Post"

More info: Writing

Run server

1
$ hexo server

More info: Server

Generate static files

1
$ hexo generate

More info: Generating

Deploy to remote sites

1
$ hexo deploy

More info: Deployment