搭建个人博客

发表于 更新于 分类于 阅读次数：

前言：小白将会在这里分享小白都能会的个人博客搭建方法。包括小白花了好多时间搜罗的一大堆杂七杂八的资料汇总，遇到的一系列麻烦问题与解决方法。希望能对另一个小白有帮助。（大佬也可以来欣赏一下小白的崩溃心路历程）

当然，小白现在也不懂太多原理，但是小白会去学习。

GitHub+Hexo搭建个人博客

一、必要工具

1. 安装并配置Node.js（最好以管理员身份运行）

视频教程：
【Node.js安装及环境变量配置】 https://www.bilibili.com/video/BV19F411t7zX/?share_source=copy_web&vd_source=b145aabb057e0f34d733fe380f0e45ce

（评论区下方基本能找到各种报错的解决办法）

2. 安装并配置git

视频教程：
【【2022最新Git教程】02 Git安装配置 | 一套带走 快速上手 保姆级 | 持续更新】 https://www.bilibili.com/video/BV133411A7zU/?share_source=copy_web&vd_source=b145aabb057e0f34d733fe380f0e45ce

3. 安装Hexo

1
npm install -g hexo-cli

二、本地生成博客

1. 在本地创建一个名为Blog的文件夹，并右键Git Bash Here

2. 初始化Hexo

1
hexo init

成功标识：INFO Start blogging with Hexo !

3. 生成本地的Hexo页面并访问

1
hexo s

本地地址：http://localhost:4000/
按Ctrl+c关闭服务器

三、上传到Github

1. 新建一个GitHub仓库

名字为你的用户名.github.io（最好不要初始生成README文件）
举例:Antarctica000.github.io

2. 修改Blog中的配置文件

打开Blog根目录下的_config.yml文件（可以用VScode）
划拉到文件底部最后四行，改成这样：

1
2
3
4
deploy:
  type: git
  repository: https://github.com/Antarctica000/Antarctica000.github.io.git（你的仓库地址）
  branch: master （你的默认分支）

一定要注意冒号后面空格！！！小白因此花费了一个世纪的时间找错误QAQ

3. 安装hexo-deployer-git自动部署发布工具

1
npm install hexo-deployer-git --save

4. 生成静态文件

1
hexo g

5. 部署到远程服务器

1
hexo d

这里如果出现网络报错，多试几遍即可。（小白在这里卡了三个世纪，直到换了一个WiFi）如果还是不行，可以尝试关闭360或者使用科学上网工具。

6. 其他

在看似简单的过程中，有可能会遇到各种千奇百怪的问题，请耐心地调试，相信你花费的时间一定没有小白久QAQ

四、撰写博客

1. 了解文件

打开Blog根目录：

  • _config.yml : 站点配置文件，之后会经常打交道的文件。与博客的格式、内容相关的设置都在这个文件里修改。

  • node_modules : 存储Hexo插件的文件，可以实现各种扩展功能。

  • scaffolds ：模板文件夹，里面的 post.md 文件可以设置每一篇博客的模板。

  • source ：所有的个人文件例如文章都在里面。很重要。

  • themes ：主题文件夹，可以下载各种各样美观的主题。

2. 下载主题并配置

懒一点的话，可以从Hexo官网或GitHub里挑选自己喜欢的主题下载。
在Blog根目录下执行：

1
git clone （主题的网址）

然后打开Blog根目录里的_config.yml文件，搜索theme关键词，把默认值改为你下载的主题名字。

再进入themes文件夹，找到_config.yml文件（不同于Blog根目录下的站点配置文件），然后根据你下载主题的官方文档，修改里面的配置，使它成为你的博客！

如果不怕麻烦想要更精美，可以下载Butterfly主题自行DIY。推荐一篇博客：
海拥Butterfly主题美化：http://haiyong.site/post/22e1d5da.html

3. 发布文章

打开source文件夹，进入并新建.md文件进行编辑即可。
记得每次修改完成后最好执行这四个命令：

1
2
3
4
hexo cl
hexo g
hexo s（每次写完文章后可以先直接输入此命令，在本地预览效果，满意之后再往下执行）
hexo d

4. 其他

如果想要绑定自己的域名，请自行搜索相关教程。谨慎绑定！