Hexo+github搭建个人博客

啊啊啊啊啊(摆烂版)

已于 2023-05-19 17:39:49 修改

阅读量102

点赞数

文章标签： github

于 2023-05-19 17:19:35 首次发布

本文链接：https://blog.csdn.net/babyytz/article/details/130770846

版权

个人博客搭建

简介

个人博客对于一个程序员来说很必要，我们每天接收大量的输入，搭建博客并且写博客，是输出的很好的方式，也是自己的一张名片。如没有其他优秀的程序员的写博客，把自己的所学，所知，所遇到的坑分享给大家，那么对于我们这些后来的学习者可谓寸步难行。正所谓前人种树，后人乘凉。知识的香火在一代代延续。其次我认为拥有一个个人博客或则是个人主页是一件很cool的事情，如果你也这样认为，那我觉得这件事情真是泰裤辣。

个人博客搭建

简介

Hexo

我们首先要借助的第一个工具叫hexo，hexo是一个基于Node.js的静态博客框架，它可以让你使用Markdown语法来编写博客文章，并将其转换为静态HTML页面。hexo具有许多有用的功能，例如主题支持、插件支持、自定义页面和部署选项等。它还可以与GitHub Pages等托管服务一起使用，以便您可以轻松地将您的博客发布到互联网上。可惜的是目前hexo是支持静态博客。hexo是基于Node.js的此前,我一直一位Node.js和vue.js都是前端框架，但才疏学浅了，但node.js是一款后端的框架。

一步 node.js的下载

在mac和linux上都可以用命令行在终端上下载，但在win下面好像不行。所以下载这一步，win电脑可能需要去node.js的官网下载，最好下载LTS版本，长期支持版。
nodejs官网

nodejs下载完后的安装，就是傻瓜步骤了，一直点下一步就好了。最后打开cmd窗口验证一下nodejs以及包管理器npm是后安装好

nodejs -v

npm -v

如果运行这两条命令，然后没有出现错误，结果是对应的版本例如上图中的v18.16.0，则代表安装成功。如果出现nojs -v不是内部或外部命令，也不是可运行的程序或批处理文件。则可以尝试去nodejs的安装文件夹下面执行该操作，或则将nodejs的安装路径添加到系统变量path中。

第二步 hexo下载

因为hexo是基于nodejs开发的，所以上述步骤是前置步骤。下载hexo需要借助nodejs的包管理器npm,但由于国内网络问题，常常需要还源,具体命令如下：

npm config set registry https://registry.npm.taobao.org/

或则

npm install -g cnpm --https://registry.npm.taobao.org/

建议采用下面一条命令，这条命令实际上也包含了第一个命令，将npm的源换成国内的淘宝源，而此后我们可以用cnpm替代npm,cnpm就是中国的npm,如果使用了第一条命令后续步骤中出现cnpm的地方用npm替代就好了。

新建一个文件夹专门用来存在与blog相关的文件,例如我所采用的文件夹为E:\Personal\blog，此后所有与博客相关的操作都在这个文件夹下面执行。在这个路径下执行下面的命令

cnpm install -g hexo-cli

使用hexo -v验证一下安装是后成功。

其中source文件是我们新建博客的存放地址，public是hexo将博客md文件转换为静态网页后，相关文件存放的地方,theme是我们的博客的风格，可以在_config.yml文件中切换。

第三步hexo中常用命令

在我们新建的文件夹下面执行hexo init初始化一个hexo博客，此时会产生下面文件。
hexo -init后的效果

hexo clean将public文件夹中的内容删除

hexo generate或则hexo ghexo会检测我们的source里面的_post的文件是后有变化，如果发生了变化再执行这条命令,hexo会根据这些变化重新生成静态网页，放到public中

hexo deploy或则hexo d将我们的本地的内容部署到远端的服务器上，本文采用github。

hexo new'post_title'或'hexo n'post_title'新建一条博客，后面跟博客的title,会在source/_post文件夹下面生成相对应的md文件，你使用Markdown语法编辑好后，调用hexo g命令就可以生成静态网页了。

然后在调用hexo server或则hexo s开启hexo服务器，hexo默认调用本机端口4000,在浏览器输入127.0.0.1:4000或则localhost:4000就可以最后的效果了。但这都是在本地玩玩，我们还需要将博客部署到远端，让他人也可以访问
hexo -s的效果

P.S: 本人已经修改过主题和一些配置。

第四步部署到github上

1.在github上新建仓库，仓库命为github用户名.github.io一个字也不能错。

2.执行命令安装部署到git上的工具, cnpm install --save hexo-deployer-git

3.设置_config.yml中delolyer属性。添加下面三行

type: git repo: https://github.com/github用户名/github用户名.github.io.git branch: main

注意缩进，yml文件的缩进要求还是挺严的，可以使用yml检测工具检测yml缩进是否有错误

执行hexo d或则hexo deploy命令，往远端推送。

此后在浏览器上输入github用户名.github.io既可以访问你的个人博客。PS(推送成功后，可能需要等几分钟，你写的推送才会转换为最终网页)

至此hexo+github搭建个人博客已经结束。剩下的怎么让自己的博客变得更美观，写出好的博客，全靠个人努力了。

第五步博客换风格

如果你部喜欢hexo默认landspace风格，可以尝试去换其他的风格，具体有那些风格已经预览图可以在github搜索一下,next风格，yilia风格,matert风格,换风格步骤也很简单，首先把这些代码的代码下载下来，把对应的文件夹，例如next文件夹放到博客下面的themes下面去，注意打开next文件夹，可以直接看到相关文件，而不是next文件夹里面又套了一层next文件夹。然后返回到博客的根目录，修改_config.yml文件下面的theme属性的值，修改为你刚刚下载的风格，例如修改为next。

theme: next