最近有个想法，那就是打造一个属于自己的博客，研究了下，发现用hexo来打造属于自己的博客，那还是相对比较简单的，在这过程中，也遇到了很多坑，所以，就想着把这些记录下来。一来可以自己看，二来说不定还能帮到别人。
所需工具
Git：版本控制器
Node：提供服务器端JavaScript开发环境
GitHub：需注册一个账号
安装Node和Git
要按照下面的顺序一步步安装，每安装完一项，可以在cmd工具中通过查看对应版本的方式检测是否安装成功：name -v，例如：node -v；只要显示出了版本号就代表已经安装成功。
安装Node。Node.js中文官网,下载到桌面按默认路径安装，一直下一步即可；
安装git。Git官网或者百度软件中心下载到桌面按默认路径安装，一直下一步即可。安装正确的话，在桌面或文件夹空白处鼠标右键菜单会新增“Git GUI Here”和“Git Bash Here”两个选项。
Git Bash 选项
这样我们安装软件的工作就完成了。
在本地电脑找个地方，新建个文件夹，我这新建了个叫blog的文件夹
文件夹名称
运行命令cmd,打开命令提示符窗口（最好用管理员身份打开），然后输入 npm install -g hexo-cli
安装hexo脚手架
如上图表示安装hexo脚手架成功，可以进行下一步。
提示：如果hexo -v 出现报错，需要使用gnvm 将node的版本切换到12以上或最新
然后，初始化hexo，输入hexo init,出现 如下图表示
初始化hexo
此时新建的blog文件夹会多出很多文件，如下图
多出的几个文件
接下来生成静态的hexo网页文件，只需要输入命令hexo g 或者hexo generate （ps:两个词之间有个空格），如下图
生成静态的hexo网页文件
有了静态文件后，那么肯定想着去预览，对不。此时再输入命令hexo s 或者 hexo server （ps:两个字母间有个空格），如下图
启动服务器预览
看到我标出的红框没，只需要复制http://localhost:4000/ 到浏览器，打开就可以看到属于你自己的网站了，当然，这只是个临时预览的网站 。如下图
网页预览
不知道大家有没觉得这个网站比较不好看，反正我是觉得不太好看。不过没关系，可以换主题的，我找来找去，选择了Next这个主题。一来这个主题相对比较好看，二来这个主题有大神做了比较完善的文档（http://theme-next.iissnan.com/），方便使用。
在命令提示符中，按键盘ctrl + c，然后输入Y 或者按再次，就可以结束服务器预览命令，此时在浏览器中输入 http://localhost:4000/ ，是打不开网页的。因为预览服务器已经关闭了。
大家可以打开这个网站 https://github.com/hexojs/hexo/wiki/Themes 选择需要的主题,我博客使用的主题为NexT（https://github.com/iissnan/hexo-theme-next ），以此为例。
在之前新建的文件夹中，我这里是blog，在里面空白处右键，点击Git Bash Here,就会弹出一个窗口，如下图
在Git Bash Here中输入git clone https://github.com/iissnan/hexo-theme-next themes/next ， 如下图
下载文件到本地文件夹
输入命令后，提示这个，表示下载完成，如下图
下载完成
此时next文件夹多出很多文件，如下图
next文件
此时，你可能迫不及待想看看这个主题吧，再介绍个命令，那就是hexo clean 这个命令是清除缓存的命令，最好每次有改动，都清除下，以避免缓存，导致网页没及时更新。再输入 hexo g ，再输入hexo s,打开网页http://localhost:4000/ ，发现网页主题还是一样呀。
其实，我们下载完文件，还需要配置下的，在主目录下，也就是那个新建文件夹blog下，有个_config.yml，看到没。这个文件很重要，基础配置都在这里配置的。如下图
站点配置文件
可以用记事本打开这个文件或者用自己喜欢的代码编辑器打开，默认是landscape主题，把这个改成next即可，如下图
修改主题为next
然后保存，在命令提示符窗口中，输入 hexo clean，再输入hexo g，再输入hexo s ，再打开http://localhost:4000/,此时页面已经更换主题成功了，高大上多了，如下图
主题的风格设定，打开http://theme-next.iissnan.com/getting-started.html，这个网站，这个网站是大神写的next主题文档，方便别人开发使用的。可以看到如下图：
主题的风格设定
打开主题配置文件，就是新建目录blog下的themes文件夹里面的next文件夹里面的_config.yml文件。如下图：
主题配置文件
打开后，只需要按照文档说的，搜索关键词scheme,再想要哪个风格，只需要把前面的#号去掉，但只能只有一个没有#号的，如下图：
默认风格
默认是这个风格
修改主题风格
然后，跟上面的一样，执行命令hexo clean ,再执行hexo g,再执行hexo s，再打开http://localhost:4000/，就能看到效果了。
修改后的主题风格
设置语言，这时大家肯定有个疑问，为什么是英文，别急，其实这也是可以设置的。按照文档说的，打开站点配置文件（ps:也就是新建文件夹blog里面的_config.yml）,如下图：
默认语言是空的，也就是英文的
我们来修改下，然后执行三命令，hexo clean ，hexo g，hexo s ，如下图效果：
修改语言
修改后的语音，已经是中文了
文档还有许多可以设置的，只要按照文档操作，都是非常简单的。这样子，基本上，也就把网站搭建起来了，但是呢，现在也只是临时的，只能在自己的电脑才能看到，下一篇文章，我会教大家如何，让自己的网站，让别人可以在网上打开看到。
第一次写技术文章，感觉挺有意思的，但也挺累的。希望能帮助到大家，有什么不足的，可以留言告诉我。有什么不懂的，也可以留言告诉我，我会及时回复的。
网友评论