咕咕咕
0%

个人博客搭建笔记

发表于 更新于 分类于
本文字数： 2.9k 阅读时长 ≈ 3 分钟

选择 hexo 框架和 next 主题搭建个人博客。

$\sum\limits_{i=1}^n a_i$

1.0 注册 GitHub

  Github 官网：Github

  正常注册网站账户流程即可。

  注意一点：在选择账户类型时，选择 GitHub 的仓库分为两种，一种是 public repositories 公开免费版，一种是 private repositories 私有付费版。其中，免费版是完全公开的，而私有版一般是由企业或者不愿公开仓库的个人用户购买，在这里，我们选择免费版即可。

2.0 下载 Git

  Git 官网：Git

  除了安装位置设置一下外，一路 next 即可。

  安装完成后，任一目录下鼠标右键出现下图即可。

​

  打开 Git Bash，输入 git 命令，查看详细信息。

3.1 绑定 Github

  我们要用 Git 上传文件到 GitHub 首先得利用 SSH 登录远程主机，而登录方式有两种：一种是口令登录；另一种是公钥登录。我们选择公钥授权。首先我们得在 GitHub 上添加 SSH key 配置，要想生成 SSH key，就要先安装 SSH，不过我们安装了 Git Bash，其应该自带了 SSH。检验一下是否安装 SSH，我们在新建的文件夹（git codelife 目录下新建）中右键打开 Git Bash：

  输入 ssh 命令，查看是否安装 ssh。

  确认安装后，输入 ssh-keygen -t rsa 命令，然后敲四次回车键。生成秘钥 id_rsa 和公钥 id_rsa.pub 文件。默认生成在以下目录：C:/Users/ASUS/.ssh。

  接下来我们要做的事情就是把公钥 id_rsa.pub 的内容添加到 GitHub。复制公钥 id_rsa.pub 文件里的内容，你可以通过目录找到 id_rsa.pub 文件的位置，用记事本打开文件复制。

  接下来进入我们的 GitHub 主页，先点击右上角，再点击 settings。进入后，先点击 SSH and GPG keys，再点击 New SSH key。将复制的公钥 id_rsa.pub 的内容粘贴到 key 内，再点击 Add SSH key。

  验证是否成功，我们可以通过在 Git Bash 中输入 ssh -T git@github.com 进行检验。第一次会询问是否继续，yes 即可。

3.1 提交文件

  提交文件有两种方法。这里只介绍第一种（就我搭建过程而言只用到了第一种而且我认为这一步仅仅是测试作用，不是关键作用）。

  在准备存储 Git 仓库的目录下，执行 git clone github仓库地址 命令即可。Github 仓库地址在 Github 个人中心查看。（选择 ssh 即可，不知道 https 和 ssh 地址在此处有什么区别，笔者选择的是 ssh）。（Git 中的复制和粘贴为 ctrl+insert 和 shift+insert）

  新建文件测试本地仓库与远程仓库内容是否一致，在本地仓库中创建 text.txt 文件。

  使用 git add 文件 命令将文件添加到「临时缓冲区」，再用 git commit -m “提交信息” 将其提交到本地仓库。

  第一次提交需要输入用户名和邮箱（注册GitHub 时使用的用户名和邮箱）具体命令按照 git bash 提示输入即可。

  最后输入 git push origin main 命令，将本地仓库提交到远程仓库。

4.0 域名

  不要域名的这一步可以省略，不是硬性的。

  笔者选择的阿里云。具体流程按照阿里云流程指南做就行，这比较容易。

5.0 安装 node.js

  node.js 官网：node.js。

  设置 npm 在安装全局模块时的路径和环境变量。在 nodejs 文件夹下新建两个空文件夹 node_cache、node_global。打开 cmd，输入

1
2
npm config set prefix "D:\nodejs\node_global"
npm config set cache "D:\nodejs\node_cache"

  设置环境变量：直接本地搜索“系统环境变量”。然后在系统变量中新建一个变量名为NODE_PATH，值为 D:\nodejs\node_global\node_modules。然后编辑用户变量里的 Path，将相应 npm 的路径改为：D:\nodejs\node_global。

  在 cmd 命令下执行 npm install webpack -g。然后 wepack 这个模块就在我们设置默认的文件夹中了。

5.1 安装 hexo

  先在 GitHub 创建一个名为 用户名.github.io 的仓库。

  新建一个空文件夹，打开 Git Bash，输入 npm install -g hexo-cli 命令安装 hexo。安装完成后，输入 hexo init 命令初始化博客。再输入 hexo g 静态部署。

  将 hexo 部署到 Github 上，在根目录（安装 hexo 的目录）下打开 _config.yml 文件（站点部署文件），添加如下内容：

1
2
3
4
deploy:
  type: git
  repository:   #你的仓库地址
  branch: main

  回到根目录，输入 npm install hexo-deployer-git --save 命令。

  最后 hexo 三连。

1
2
3
hexo clean   #清除缓存文件 db.json 和已生成的静态文件 public
hexo g       #生成网站静态文件到默认设置的 public 文件夹(hexo generate 的缩写)
hexo d       #自动生成网站静态文件，并部署到设定的仓库(hexo deploy 的缩写)

  至此，使用 https://xxx.github.io 即可访问博客。不要域名的话，至此已结束。

6.0 解析域名

  在阿里云控制台中，为要使用的域名添加两条解析记录：

  • 第一条：主机记录选择 www，记录类型选择 CNAME，记录值为 GitHub 仓库名。
  • 第二条：主机记录选择 @，记录类型选择 A，记录值为 IPV4 地址。

   IPV4 地址获取方式为：在 cmd 中输入 ping + 你的GitHub的网址 命令查询。

  上述步骤完成后，在根目录下的 source 文件夹中，添加 CNAME（无后缀） 文件，内容写上要使用的域名。完成后，在根目录下 hexo 三连。最后在 GitHub 的仓库 settings 中查看 Github Pages，可以看到 Custom domain 如果域名没有被填进去，手动填写保存即可。