效果预览:https://your-personal-domain.com
准备:
- Windows电脑
- GitHub账号
- 使用Hexo框架搭建个人站点软件准备(以下步骤需仔细阅读)
安装过程:
-
Node.js 安装
- 访问官网:http://nodejs.org/en/
- 按照安装过程依次点击即可,安装过程很简单。
-
Git安装
- 访问 https://git-scm.com/ 获取Git安装包
- 下载后将安装包拖入wine中,进行安装(建议使用Visual Studio Code打开项目文件夹,它支持多种语言,视图简洁且拥有众多插件)
-
安装Hexo
- 在当前目录下,打开终端窗口,执行以下命令:
npm install hexo-cli -g
- 在当前目录下,打开终端窗口,执行以下命令:
检测:
-
检测Node.js安装是否成功:
- 打开终端,输入
node -v和npm -v,查看版本号确认安装
- 打开终端,输入
-
安装淘宝的镜像源(提高下载速度)
- 修改配置文件
.hexo/hook/postdeploy.js添加以下代码:const hexo = require('hexo'), { exec } = require('child_process'); // 清除缓存,更新 npm 版本为最新版 let clearCacheCmd = 'npm cache clean --force'; console.log('> 清除缓存:', clearCacheCmd); exec(clearCacheCmd); let updateNpm = 'npx npm install -g @hexojs/core'; console.log('> 更新 npm 版本:', updateNpm); exec(updateNpm); // 安装淘宝镜像 let taobaoMirrorInstall = 'npm install -g cnpm --registry=https://registry.npm.taobao.org'; hexo.extend.console.register('postdeploy', function(data) { if (data.config.theme === 'hexo-theme-matery') { console.log('> 安装淘宝镜像:', taobaoMirrorInstall); exec(taobaoMirrorInstall); } });
- 修改配置文件
新建仓库:
- 在GitHub上创建一个新的仓库,例如
username.github.io - 下载并解压Hexo安装包
- 将Hexo项目中的文件复制到这个新仓库中
配置_config.yml:
- 找到Blog目录下的
_config.yml文件 - 使用Visual Studio Code等编译器打开,建议使用它来编辑代码(支持多语言、视图简洁且拥有多种插件)
- 修改以下部分代码:
type设置为gitrepository替换为你刚刚创建的GitHub仓库地址branch设置为master
部署:
- 在本地 terminal 窗口,进入博客项目文件夹
- 执行以下命令:
hexo clean # 清除生成的静态页面和数据库缓存 hexo generate # 生成静态页面(该命令默认部署到public目录) hexo deploy # 部署网站到GitHub远程仓库
访问站点:
- 访问
https://your-personal-domain.com查看你的个人站点
进一步深化操作过程:
- 在GitHub找到并下载你喜欢的Hexo主题,如
hexo-theme-matery - 将主题文件夹中的代码复制到 Hexo 根目录下的
themes目录中 - 打开
_config.yml文件,将theme字段修改为刚刚下载的主题名称
现在,你的个人站点已经搭建完成。你可以开始写作、设计布局和发布内容了!祝你好运!