Hexo安装并撰写你的第一篇文章

Hexo是一个进行博客搭建和开发的框架,它的操作和配置相对来说非常得简单,也很受欢迎。本文讲解如何进行Hexo框架的安装、Hexo常见的几条命令操作以及利用Hexo编写自己的第一篇文章。

一、前言

Hexo是一个十分轻量和流行的博客框架,其官方中文文档地址为https://hexo.io/zh-cn/docs/。我的个人网站当然也是采用的Hexo进行搭建的。

二、安装

1.安装前提

要进行Hexo的安装,则你的电脑里必须要安装Node.jsGit,不过本文暂不讲解这两个程序的安装说明,下面给出两个软件的官方网站以及安装参考教程。

2.安装Hexo

确保您的电脑上已安装配置好了Node.jsGit,接下来进行Hexo的安装就相当简单了,通过调出命令行(cmd窗口),输入以下命令,即可安装Hexo

1
npm install -g hexo-cli

三、Hexo常用命令

Hexo的常用命令很少,我经常用到的,也不过只有5、6条命令,并且非常好记。下面一一讲解之。

1、hexo init 命令

该命令是用来初始化项目的,只有在新建项目时会用到,其使用格式为 hexo init folder,其中folder为你的项目名,常用的有blogwebwebsite等。

2、hexo new 命令

该命令用于生成一篇文章,使用方法为 hexo new [layout] your_article_name 。若是省略layout参数,则以默认的方式进行布局。

3、hexo clean 命令

该命令用于清除缓存,使用该命令会清除掉项目文件夹下的public文件夹,使用方式为hexo clean

4、hexo g 命令

该命令用于生成public文件夹中的内容,使用该命令会更新项目文件夹下的public文件夹,使用方式为hexo g

5、hexo s 命令

该命令用于生成启动服务预览,成功执行该命令,在浏览器中输入localhost:4000,即可预览你的网站,使用方式为hexo s

6、hexo d 命令

该命令用于部署,即将本地内容部署到设置的服务器上,使用方式为hexo d

7、其他命令

关于Hexo其他命令及更详细的介绍,请访问hexo官网指令讲解

四、构建Hexo项目

Hexo安装完成后,在你需要构建项目的文件夹下,进行Hexo项目的搭建。我是在G盘下进行操作的。

1、启动Git Bash

进入相应盘符或者文件夹下,点击空白处,在出现的菜单中选择Git Bash Here,即可启动Git Bash。

2、初始化项目并安装依赖

在启动的Git Bash中依次执行以下命令。

1
2
3
hexo init blog
cd blog
npm install
注意其中的blog可以替换为其他字符串,推荐使用blogwebsiteweb等,即根据功能来命名。cd命令是切换目录的意思。npm install命令会安装项目所需的依赖包,安装完成后,会在项目文件下生成一个node_modules目录。

3、新建一篇文章

当项目搭建完成之后,就可以写文章咯。通过Git Bash,执行以下命令,则可以新建并生成一则篇名为test的文章。

1
hexo new test
注意该篇文章默认采用的布局为post布局,新建的文章路径为blog\source\_posts\test.md,生成的文件路径为blog\public\年\月\日\test\index.html

4、启动本地预览

执行以下命令,然后打开浏览器,在地址栏中输入localhost:4000,则会看到刚生成的页面。

1
hexo s
页面效果如下所示:

5、编辑文件

打开刚才新建的文件,即blog\source\_posts\test.md,我们插入以下内容:

这是我的第一篇文章,采用hexo框架搭建而成的,我也有自己的个人博客了。

保存文件,刷新一下网页,再次查看效果如下:

五、总结

博客的搭建与新建文章的方法到此就介绍完毕了,各位看官应该能够新建和编辑文章了。顺便一提,Hexo的文章编辑采用的是MarkDown语法,不熟悉该语法的朋友,可以访问MarkDown语法说明进行学习。当然,目前的网站存在很大的不足:

  • 只能在本地查看。博客也好,个人网站也好,应该是共享的,只能在本机上访问,又有何乐趣呢?
  • 页面样式丑陋。这个网站的外观和布局,确实让人看着有点难受呀。
  • 没有互动功能。博客类网页常见的评论留言、友情链接、打赏、分享功能没有,互动性不强。

在下一篇文章中,将讲解如何将项目部署到Coding上,让所有用户都能搜索查看。后面的文章中, 将逐一改善以上提到的不足之处。

六、相关链接

--本文结束 感谢阅读--
创作十分不易,原创更应鼓励