github个人博客搭建笔记

疫情被困在老家两个月，年前回家的时候是计划二月初就回校准备毕业论文的，书和笔记本都没带回来，这下可好，呵呵。幸亏老家还有一台旧电脑，拼死拼活把毕设做好了初稿，还是闲着没事干怎么办？不如来搭建一下个人博客吧。几年前有试着去做过几次，但都因为觉得太麻烦而半途而废了。这次一定要克服这种知难而退的坏毛病！

博客平台的选择：

可以选择GitHub，cnblog，或者csdn。csdn广告可以理解但是着实让人头疼，而GitHub和cnblog不仅无广告而且内容完全可定制，搭建起来更能锻炼自己。

web框架配置

个人博客是轻量级的网站，与之对应的静态web框架可以使用jekyll或者hexo。

1. jekyll

jekyll:(https://www.jekyll.com.cn/) 按照官网的话说是一个可以将纯文本转化为静态网站和博客的框架，他依赖完整的ruby开发环境。

jekyll的工程文件夹层次分明，资源分门别类摆放，需要使用时只需要把写好的博客放到特定文件夹，然后ruby编译一下就可以自动生成好网页。

听上去好像非常简单，所以我先选择使用jekyll。

2. jekyll环境配置

jekyll依赖ruby开发环境，那就先扯一下红宝石ruby吧。按照菜鸟教程说法，ruby是开源的、面向对象的、服务器端的脚本语言，（面向对象OOP：对象指的是类的实例，就是通过构造类并封装数据和函数的一种编程思想）一生之敌是python。红宝石比蟒蛇年轻，且专注于构建网站，也成就了包括twitter、airbnb、gayhub的门户网站。不过现在⑧太行了，大家都去搞golang了，但至少瘦死的骆驼比马壮，还能再坚挺个二十年吧！

ruby的官方支持平台包括mac和ubuntu等一众linux发行版系统，就是不包括windows。不过还好，有专门的rubyinstaller软件提供图形化安装操作。下载地址:(https://rubyinstaller.org/)
安装程序最后会问你要不要运行ridk install，其解释是用来安装gem和原生扩展。gem（rubygems简写）是ruby的包管理器，类似于pip之于python。ok，那就下了。

gem的安装脚本会提供三种安装选项，基本安装、自定义安装和带mingw的完全安装，正好我电脑里还没有c++编译器，果断选3。安装完到cmd确认一下两样玩意的环境变量有没有问题。

为了减少项目之间的依赖性，可以考虑下载一下ruby的gem多版本管理器，叫bundle。

到此位置jekyll的环境配置完成，使用命令 gem install bundle jekyll安装bundle和jekyll。然后终端就卡住了...把不是必须的bundle删掉再来一遍还是卡住了。ok，老生常谈的换源解决国情问题，使用命令

gem sources --add http://gems.ruby-china.org/ 
gem sources --remove https://rubygems.org/ 

替换国内源，满怀希望重新install，还是卡...算了，换一个，jekyll下次再研究。

3. hexo环境配置

hexo也是一个轻量级的快速博客框架，依靠Node.js给他带来了很快的生成速度、支持MD语言、上传gayhub便捷，还支持支持插件，看杀过去还不错。

说到hexo就要谈谈它的爹，大名鼎鼎的Node.js。本来Js（Javascript语言，或者说ECMAscript）是运行在前端、可嵌入到html里的脚本语言，在服务器端是不能直接跑的（跑的话要跑在JSP，java server page文件里）。
后来随着前后端的趋同发展，前端基于js出现了jquery库简化了dom操作，后端则出现了Node.js直接提供了js的运行环境，让前端程序员需要参与后端设计的时候不会被不认识的ruby、java、python程序难倒，属实牛逼。

去Nodejs下载，牛逼新版本还能支持32位，这让我家里这台十年前的老电脑老泪纵横，当然更让人流泪的是它的下载速度。莫得办法，挂梯子下吧。安装程序一路点下一步就行，它会自动帮忙安装node的包管理工具npm。安装完毕后进终端检查一下这两个玩意弄好没有。

环境配置完毕，npm install hexo -g开始hexo安装，又是蜗牛般的速度，npm config set -g registry https://registry.npm.taobao.org进行npm淘宝换源，速度杠杠滴。

cmd检查hexo -v，报错:“无法加载文件 C:\Users\Admin\AppData\Roaming\npm\hexo.ps1，因为在此系统上禁止运行脚本”。mua的。百度得到的说法是首次在计算机上启动 Windows PowerShell 时，现用执行策略很可能是 Restricted（默认设置）。Restricted 策略不允许任何脚本运行。

键入命令get-executionpolicy检查策略的确如此。fine。键入set-executionpolicy remotesigned修改策略为允许运行不信任的脚本（你怕不是非微软出的就都不信任哦），注意此命令要在管理员权限下运行。弹出的选项选择[A]全是。重新检查一下，策略变成了RemoteSigned。重新hexo -v，弹出相关配置属性，安装成功。

4. hexo安装配置

进入博客资源文件夹，打开cmd，输入hexo init（文件夹一定要是空的，奇怪的要求）初始化他会从github里clone模板下来，又是要等一万年，睡了睡了~

半夜起来发现下载崩溃了。hexo直接都没了，行吧，用推荐的指令npm install hexo --save重下，然后重新初始化。

第二天起床，出现有“start with hexo”字样说明搞定了。

中间出现了“looking for funding”的字样，查了之后说是你可以用npm fund查找并支持这些包的开发商，那敢情好，下次一定下次一定。

命令hexo -g直接生成网页静态文件，命令hexo s启动服务器，默认端口4000。

网页构造成功，默认界面还挺好看！

hexo的目录结构如下：

|-- _config.yml     ----全局配置文件
|-- package-lock.json
|-- package.json    ----hexo框架的参数和所依赖插件
|-- scaffolds		----脚手架，新建文章时hexo会用这个目录的文件构建
|-- source			----资源目录
   |-- _posts		----存放新建博文
|-- themes			----网站主题目录，每个子目录对应一主题，landscape为默认
|-- public          ----存放编译后md文件生成的html界面
|-- .gitignore		----git过滤规则文件

搭建网站要配置的地方不算很多，详细的配置说明下一篇博文再见吧。

5.hexo连接git

首先是git要设置用户名和邮箱：

$ git config --global user.name "用户名
$ git config --global user.email 邮箱@example.com

本地git生成rsa密钥，在github上添加，本地命令ssh -T git@github.com查询，得到Hi，用户名 字样的响应就能确定git和github连上了。

打开配置文件_config.yml，找到deployment部分进行填写，注意冒号后一定要有空格,不然这一行识别失败。

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repository: git@github.com:name/example.git
  branch: master

在上传之前，先下载一个相关插件hexo-deployer-git。博客根目录打开cmd输入：

npm install hexo-deployer-git --save

安装完毕后，在博客根目录打开Git Bash（用win自带的cmd听说可能有权限问题？？），运行命令：

hexo clean && hexo g && hexo d

清缓存、重新生成、上传一气呵成。打开github的仓库界面可以看到，hexo上传的是编译出来的web工程。

最后要github要注意一个点，上传的仓库名字一定一定一定一定要叫用户名.github.io,github pages里选择masterbranch，不然会出现404。

另外，hexo有时候会出现代码段的反引号识别失败的问题，把代码段外的内容都算进去。查询后的结果说是hexo支持的md规范相对严谨，最好在反引号使用时前后都要空出一行，那行吧。

一开始效果图显示不出来，查一下是要如下设置：

1. 下载hexo-asset-image插件：

  npm install https://github.com/CodeFalling/hexo-asset-image --save

他会令你新建博文md文件的时候创建一个同名文件夹，那我这已经写好了的就自己手动创一个，把图片丢进去并用相对路径写好引用。
2. 打开_config.yml，修改post_asset_folder选项为true，让你的hexo明白你的博文有附带的文件夹。
3. 运行命令

  hexo clean && hexo s && hexo g

先在本地查看一下效果。注意开启了服务器的一定要重新开，才能重新加载_config。
最后效果如图所示：

后记

终于做出来啦！这是我第一次做博客，markdown也打的很粗糙，配环境配到一半才想起来可以同步打点字，也是到最后才想起来可以加点图，前前后后边查资料打代码边打博客反复调试花了接近四个小时，hexo的使用没有想象中的快速，在更新网页后本地查看时会加载比较久的时间，还有坑爹的包下载速度，但我心中还是充满了喜悦。世上无难事，只要肯攀登，希望自己以后也能如此坚持下去吧！