前言
2020年的新年真的亲身感受了渡日如“年”。在家憋了5天之后,任凭怎么下拉刷新也刷不出各个社交平台的新内容了🤣 既然闲着也是闲着,不如从头搭建一个静态个人博客吧!这里选择Hexo作为构建静态博客的框架来搭建。之前也尝试过Jekyll,但是感觉社区还有皮肤都没有Hexo丰富,不如就推倒重新搭建一套。
在尝试Hexo的搭建也踩了一些坑,这里也同时分享一下解决办法给大家参考一下😀
环境配置
这里我主要以我个人的环境来作为说明:
1 | MacOS |
因为Hexo是基于Nodejs开发的,所以还需要配置如下环境才能正确运行:
- Nodejs
- npm
在这里强烈推荐大家使用NVM(Node version manager)来安装Node环境,方便之后的插件安装和管理。
安装方式大家可以参考 这篇文章
安装好了Node和npm我们的环境准备工作就结束了下面就是Hexo的安装。
💿安装&配置Hexo
首先打开大家各自熟悉的命令行软件,直接在命令行里面敲下面的命令
1 | $ npm install -g hexo-cli |
这里在国内安装的话,因为众所周知的原因安装时间可能会非常长。这里可以把npm的源替换为taobao的国内源。
1 | $ npm install -g mirror-config-china --registry=http://registry.npm.taobao.org |
这个时候有可能会遇到报错,这个是因为npm没有root权限所导致。
这里再次推荐大家参考 这篇文章 避免遇到这个问题
等在命令行安装完成Hexo-cli之后我们就可以真正开始初始化一个Hexo博客项目了。
- 首先在命令行定位到你想要Hexo文件保存的文件夹地址
1
$ cd YourProject Folder
- 初始化Hexo:
1
$ hexo init yourusername.github.io (yourusername替换为你的GitHub账号名)
这里如果在国内的话会再次遇到等待时间长的问题,这是因为众所周知的原因导致github连接速度限流了。
进入仓库目录,安装依赖包
1
2$ cd yourusername.github.io
$ npm install到这一步,hexo的框架的准备工作就已经做完了。如果现在想要新建一篇文章,输入如下命令
1
$ hexo new "New Page" //(文件会保存在source/_posts目录下,之后可以直接访问目录下的文章进行编辑)
生成页面并本地预览你的博客:
1
2$ hexo g
$ hexo s
到这里崭新的博客网站已经生成成功,大家打开浏览器输入 localhost:4000 就可以预览你的博客了。
Hexo还提供了非常多主题可以选择,这里大家可以到 这里 挑选自己喜欢的主题下载安装。
更换主题这里还有其他非常多的坑,这里也是搞了两天才让主题正确的运行起来。这些开源主题很多也是疏于更新,又加上网速实在感人,很多时候得直接从Github上面下载压缩包解压文件。但是这些主题在编写的时候还需要其他Hexo控件作为依赖包,这些还得不断调试浪费的很多时间。看来还是要学习一点前端的知识,之后如果想开发自己的主题的话也可以用得上。
发布到GitHub Pages
在本地编辑完毕想要的内容之后就可以吧内容发布到GitHub Pages来作为个人网站了。
- 首先需要安装 hexo-deployer-git 来帮助快捷发布
1
$ npm install hexo-deployer-git --save
- 现在配置_config.yml文件,把yourusername替换为GitHub的用户名
1
2
3
4deploy:
type: 'git'
repo: git@github.com:yourusername/yourusername.github.io.git
branch: master - 最后清理项目,构建并发布
1
2
3$ hexo clean
$ hexo g
$ hexo d
这里如果配置正确的话,基于Hexo的博客就已经生成了。现在可以到yourusername.github.io查看最终的效果了。
参考资料
在这个过程中还是参考了很多网上的资料,这篇文章还是帮助比较大也比较详细的,可供参考。