请参考手把手教你从0开始搭建自己的个人博客 |无坑版视频教程| hexo_哔哩哔哩_bilibili

安装Nodejs

node -v # 查看node版本

npm -v #查看npm版本

安装第三方工具

安装cnpm

npm install -g cnpm --registry=http://registry.npm.taobao.org #安装淘宝的cnpm 管理器

npm config get prefix 查看自己的npm安装地址

image-20240808190759735

安装后启动发现目录下没有cnpm.cmd文件

image-20240808190819126

导致即使配置好环境变量也无法启动

image-20240808190832467

改用yarn

npm install -g yarn #安装yarn

image-20240808194147523

yarn add hexo-cli #使用yarn 安装 hexo-cli

安装成功后查看 yarn的默认安装路径 yarn global dir

image-20240808194204521

此目录下的.bin文件里有hexo.cmd

image-20240808194215704

配置全局变量指向此路径

完成后 输入 hexo -v 查看版本

image-20240808194228664

使用hexo

hexo init blog 新建文件夹blog

image-20240808194301428

cd blog #进入新建的文件夹

创建第一篇博客

hexo n "我的第一篇博客" #创建 一篇名称为 “我的第一篇博客”的博客

hexo clean # 清理

hexo g # 执行

hexo r # 运行

image-20240808194315024

如图浏览器输入 http://localhost:4000 访问

image-20240808194331047

如果出现 No layout：index.html 请注意你的 站点配置文件的theme名跟下载的theme文件夹名字是否一致

image-20240808194402189

image-20240808194510057

image-20240808194519441

推送到github

在github上新建库， 同时指定库名称 必须是 #{your.username}.github.io

image-20240808194530025

进入之前创建的blog文件夹下，找到 _config.tml文件

image-20240808194543315

修改为,repo的路径就是刚刚创建的git库路径

1
2
3
4
5
6
7
# Deployment
## Docs: https://hexo.io/docs/one-command-deployment
deploy:
  type: "git"
  repo: https://github.com/daidawang/daidawang.github.io.git
  branch: master

保存后

yarn add hexo-deployer-git #安装hexo的git插件

image-20240808194605639

hexo -d 推送远程，弹出登录验证，我选择了机器码的验证，

image-20240808194617320

输入机器码后，验证成功

image-20240808194625981

仓库里有内部

在git里设置页面好如下配置

image-20240808194636416

访问地址https://daidawang.github.io/

添加搜索功能

进入algolia https://dashboard.algolia.com/ 官网

登录后，选择第三个上传方式，新建一个 .json文件 并上次

选择 暂时跳过

配置图床

Markdown 文件中的图片都是引用的，图片是放在本地的，那怎么在博客中引用图片呢？

这里需要使用到图床，而我选择的是国内的阿里OSS。

然后可以参考这篇教程：手把手教你搭建阿里云图床(PicGo+Typora+阿里云OSS)，新手小白一看就会-阿里云开发者社区 (aliyun.com)