我的个人博客搭建

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

我的博客搭建详细步骤

事前准备

1.安装 Node.js

Node.js® 是一个基于 Chrome V8 引擎 的 JavaScript 运行时环境[1]
建议下载 LTS 版本 (Long Term Support | 长期支持)[2]
从官网上下载安装包，然后跟着提示进行操作即可
下载完毕后可以进入控制台
输入 node -v 查看 node 版本[3]
输入 npm -v 查看 npm 版本 (node package manager | node包管理器)[4]

2.安装 git

Git 是一个免费的开源分布式版本控制系统[5]
从官网上下载安装包，然后跟着提示进行操作即可，步骤较多，可参考各种安装教程
下载完毕后可以进入控制台，输入 git --version 查看 git 版本，确认安装成功

git config --global user.name “输入你的名称”
git config --global user.email “输入你的邮箱地址”
设置自己的名称和电子邮箱[6]

3.安装淘宝镜像 (可选步骤)

如果使用 npm 安装依赖过慢
进入控制台输入如下命令安装淘宝镜像
npm install -g cnpm --registry=https://registry.npm.taobao.org
使用 cnpm 代替 npm 以提升速度

开始搭建

1.下载 Hexo

在控制台输入 npm install -g hexo-cli 安装 hexo[7]
进入控制台输入 hexo -v 查看 hexo 版本，确认安装成功

2.于指定文件夹创建博客工程

在控制台中转至目标文件夹并输入hexo init[8]
目标文件夹内将生成完整的博客工程文件

移动至该文件目录输入 npm install 安装所需依赖[9]

输入 hexo s 命令，于本地4000端口启动博客[10]
访问 http://localhost:4000 就可以看见你的博客了
(默认创建一篇叫 Hello World 的文章)

3.创建一个 github 仓库

登录 Github
新建一个 repsoitory (构建好的博客将推送至该 repo)

仓库名称必须要和 github 的用户名一致[11]
例: username.github.io

4.安装博客的 git 部署插件

指令: npm install --save hexo-deployer-git[12]
如果在控制台操作失败了可以在 Git Bash 中输入该指令

5.在 _config.yml 文件中修改部署信息

打开位于 hexo 工程根目录的 _config.yml 文件[13]

1
2
3
4
deploy:
  type: git
  repo: (这里填写你创建的仓库的地址)
  branch: master

6.将博客部署至 github 仓库

输入 hexo d 将博客推送至 github[14]

注意，初次推送需要验证 github 账户
Username for ‘https://github.com’: 输入你的 github 用户名
Password for ‘username’: 输入你的 github 密码[15]

推送完毕后，github 需要一定的时间部署博客项目[16]

如果该步骤出现错误
git config --global user.name “输入你的名称”
git config --global user.email “输入你的邮箱地址”
设置自己的名称和电子邮箱

7.访问个人博客

访问 仓库名.github.io 即可[17]

  1. Node.js 官方 About Node.js 与 V8 官网 v8.dev 支撑 Node.js 以 V8 为 JavaScript 引擎的运行时定位。 ↩︎

  2. Node.js 官方 previous releases 按 Current、Active LTS、Maintenance LTS、End-of-life 区分发布线；博客搭建这类长期维护环境通常优先选仍受维护的 LTS，而不是只追最新版。 ↩︎

  3. Node.js 官方 command-line API 支持 --version / -v 输出 Node.js 版本，用于确认安装结果。 ↩︎

  4. npm CLI 官方 npm-version 与 CLI 用法支持 npm -v / npm --version 查看 npm 版本；这里的检查用于确认随 Node 环境安装的包管理器可用。 ↩︎

  5. Pro Git Getting Started - About Version Control 将 Git 描述为分布式版本控制系统，并解释本地仓库拥有完整历史的工作方式。 ↩︎

  6. Pro Git First-Time Git Setup 将 user.name 与 user.email 列为首次配置项；这两个值写入 commit 署名，不等同于 GitHub 登录凭据。 ↩︎

  7. Hexo 官方 Setup 说明 Hexo 安装依赖 Node.js 与 Git，并通过 npm 安装 hexo-cli。 ↩︎

  8. Hexo 官方 Commands 定义 hexo init [folder] 用于初始化网站。 ↩︎

  9. Hexo 官方 Setup 的初始化流程包含进入项目目录后运行 npm install 安装依赖。 ↩︎

  10. Hexo 官方 Server 说明 hexo server 用于启动本地服务器，默认地址为 http://localhost:4000/；hexo s 是该命令的别名。 ↩︎

  11. GitHub Docs Creating a GitHub Pages site 区分 user / organization site 与 project site；用户站点仓库通常使用 <username>.github.io 命名。 ↩︎

  12. Hexo 官方 One-Command Deployment 说明使用 git 部署时需要安装 hexo-deployer-git 并配置部署信息。 ↩︎

  13. Hexo 官方 One-Command Deployment 给出 deploy.type、repo、branch 等配置项；这些字段应与实际 GitHub Pages 仓库和发布分支一致。 ↩︎

  14. Hexo 官方 Commands 定义 hexo deploy / hexo d 用于部署网站；实际效果取决于已配置的 deploy 插件。 ↩︎

  15. GitHub Docs About authentication to GitHub 与 Managing personal access tokens 说明命令行 GitHub 认证不应再理解为输入账户密码；现代做法通常是 personal access token、Git Credential Manager 或 SSH。 ↩︎

  16. GitHub Docs About GitHub Pages 说明 GitHub Pages 从仓库内容构建并发布站点；推送后出现可访问页面可能受构建和发布流程影响。 ↩︎

  17. GitHub Docs Creating a GitHub Pages site 支撑用户站点发布到 https://<username>.github.io/ 这一访问形态；project site 则会带仓库名路径。 ↩︎