利用hexo+github部署属于自己的个人博客网站(2025年3月所写)

news2025/3/18 14:26:57

利用hexo+github部署属于自己的个人博客网站

前情提要:如果你出现了莫名其妙的报错,可能与权限有关,可以以管理员的身份运行git bash或者cmd

本篇博客仅限于利用hexo搭建博客,并且部署到github上面,让自己可以有一个访问的域名,不涉及博客的上传以及博客网站的美化。

当然笔者博客上传和网站美化以后会再写一篇博客进行说明

参考自

【基础篇】hexo博客搭建教程 - huanhao - 博客园

Hexo 博客搭建并部署到 GitHub Pages(2024最新详细版)_github pages上部署hexo-CSDN博客

这两篇博客混着看的,因为有的地方这篇不行另外一篇可以,所以我混着来的,而且有的地方可能版本太老了,就不太对了,笔者就再加上笔者自己的情况供大家参考了

文章目录

  • 利用hexo+github部署属于自己的个人博客网站
    • 1.安装git
    • 2.安装nodejs
    • 3.安装hexo
    • 4.初始化博客(建立本地的网站)
      • 可能遇到的问题
      • 解决方法
    • 5.预览自己搭建的本地网站
    • 6.更换主题
      • 6.1如何下载主题
        • 方法1
        • 方法2(推荐)
      • 6.2修改配置文件
      • 6.3预览主题
    • 7.把博客部署到github上面去
      • 1.coding
      • 2.github部署(推荐)
      • 3.得到自己的网址
        • 原作者的操作
        • 笔者的操作


1.安装git

这个教程网上有很多,可以自己搜索,也可以看看笔者的

黑马程序员 | Git详细教程笔记 | 使用命令 | 从安装到入土_gitee开源项目《黑马课程验证指南》-CSDN博客

2.安装nodejs

【Node】node.js安装与配置(详细步骤)-CSDN博客

除了这篇文章的内容,还要安装cnpm

在git bash里面执行下面的命令

$ npm install -g cnpm

检查cnpm是否安装成功

执行

$ cnpm -v 

如果输出版本号就是安装成功了


3.安装hexo

在git bash或者cmd执行下面的命令安装hexo

$ cnpm install hexo-cli -g

image-20250316222838327

终端执行hexo -version出现 Hexo 版本号,说明安装成功

image-20240622101325032

4.初始化博客(建立本地的网站)

创建一个文件夹myblog,但一定要保证myblog是空的,不创建也行

image-20250317193739658

$ hexo init myblog
cd myblog
npm install

初始化成功显示:

image-20240622102859365

vscode 打开 myblog,项目目录如下:
在这里插入图片描述

_config.yml 存放的是博客配置信息, source/_posts 是存放文章的地方。

可能遇到的问题

$ hexo init myblog
INFO  Cloning hexo-starter https://github.com/hexojs/hexo-starter.git
fatal: unable to access 'https://github.com/hexojs/hexo-starter.git/': SSL certificate problem: unable to get local issuer certificate
WARN  git clone failed. Copying data instead
INFO  Install dependencies
INFO  Start blogging with Hexo!

如果出现这样的报错和页面

问题核心原因

SSL证书验证失败:Git在克隆GitHub仓库时无法验证其SSL证书有效性,可能由以下原因导致

  1. 本地Git证书配置缺失或错误(尤其Windows系统)
  2. 网络环境限制(如国内访问GitHub不稳定)
  3. 系统时间/时区错误(证书验证依赖准确时间)

解决方法

我查了很多,就这个蛮好用的,可以用用

临时关闭Git的SSL验证(应急方案)

git config --global http.sslVerify false  # 关闭验证
hexo init myblog                          # 执行初始化
git config --global http.sslVerify true   # 完成后恢复验证

⚠️ 此方法存在安全风险,仅建议临时使用。

5.预览自己搭建的本地网站

打开终端,进入项目根目录执行:

hexo clean # 清除缓存文件,建议写完文章后执行一次
hexo g		# 生成 public 文件夹,写完文章执行
hexo s		# 启动 hexo 服务

image-20250317132528931

image-20250317132541809

image-20250317132553761

image-20250317132609570

生成的地址可以去访问到默认的界面,bash这会会卡着,等你按下ctrl+c才会停止,停止后网站也会不可访问

浏览器访问 http://localhost:4000/ 出现下图说明启动成功
在这里插入图片描述

6.更换主题

hexo的所有主题都在下面这个地址:

https://hexo.io/themes/

你可能会在这个地址看到很多好看的主题,但是我们要慢慢来,有些主题的配置难度还是很高的

我们要找一个功能齐全,配置简单的主题练练手

就是这个新手入门hexo必备的Next主题

预览效果:https://theme-next.org/

项目地址:https://github.com/theme-next/hexo-theme-next

配置文档:https://theme-next.org/docs/getting-started/

但是笔者用的是butterfly,因为觉得这个好看功能多
https://butterfly.js.org/ 大家可以去看看

如你所见,其实每个主题都会包含这个三个东西

  • 预览效果
  • 项目地址
  • 配置文档

点击主题的图片可以打开预览地址,点击主题的标题可以打开项目地址

配置文档我们需要自己去项目地址找,大多数主题的项目地址都是英文,大家可以开翻译找一下

image


6.1如何下载主题

方法1

打开主题的项目地址后,点击Clone or download

然后复制https开头的地址

image

然后在你的博客文件夹下面打开git bash

执行:

git clone 复制的地址 themes/主题名字

如图:

image

现在给你解释一下这个命令

git clone 代表克隆,后面接上一串下载地址,最后面的themes/next是把文件夹下载到主题目录下,并把主题文件命名为next

方法2(推荐)

如果你觉得比较麻烦,还有第二个办法

打开主题项目地址,然后点击Clone or download,然后点击Download ZIP

这样可以下载主题文件压缩包,前提是你已经登入了github(没有账号的,请自己注册一下)

image

然后解压压缩包,把文件夹放在博客目录下的themes目录,并把文件夹命名为主题的名字

image

6.2修改配置文件

在博客目录下创建 _config.butterfly.yml,其实是创建 _config.你下载的主题名.yml

image-20250317195209399

将 butterfly 主题的 _config.yml 内容复制进去(打开链接复制),就是这个页面里面的_conffig.yml

image-20250317195327831

后续修改博客的配置,例如标题,头像,评论等等只需要在 _config.fluid.yml文件中配置就行


6.3预览主题

在博客目录打开git bash

执行

hexo clean
hexo g
hexo s

还是会出现一段浏览地址,我们在浏览器打开就行了

image

注意:有些主题你更换之后是暂时无法预览的,因为有的主题还需要安装它需要的依赖,这一般都会在主题的文档里面提到,只有安装它的依赖之后才可以正常预览,这里暂时不做说明,会在hexo教程进阶篇说到

7.把博客部署到github上面去

现在我们的博客都是只能本地预览,如何将我们的上传到一个地方,然后通过域名访问呢?

你可能觉得需要一个服务器再买个域名绑定,我可以告诉你都不需要

下面介绍两种部署方法

先来个对比

github:

  • 国外网站,是英文
  • 访问速度较慢
  • 不需要实名认证
  • 域名形式可以自定义

coding:

  • 国内的平台,网站是中文
  • 访问速度快
  • 部署网站需要实名认证,只需要填写身份证号即可
  • 域名是随机给的,所以很长而且不能自定义

如果你有自己的域名,github和coding都可以绑定域名

笔者推荐github,因为笔者没用过coding网站

1.coding

https://coding.net/user

注册一个coding的账号,这里不做演示

然后按照图片新建一个项目

image

选择devops

image

填入相关信息,记得勾选**启用README.cd文件初始化项目**

image

然后完成创建


我们暂时不能直接上传,需要进行一些配置,如下:

接下来需要我们创建一个git秘钥

打开git bash(不要求在哪个目录)

执行: “这里面是你的邮箱”

不管出现什么信息,你只需要回车就可以了

$ ssh-keygen -t rsa -C “your_email@youremail.com“

然后执行

$ cat ~/.ssh/id_rsa.pub

会输出你的秘钥,我们复制输出信息就行了

然后点击头像,打开个人设置–选择SSH公钥–新增公钥

image

然后将你复制的秘钥粘贴进去,记得勾选永久有效

image


然后打开git bash

执行:

$  ssh -T git@git.coding.net

会提示你下面这个,输入yes回车就行了

Are you sure you want to continue connecting (yes/no/[fingerprint])? 

接下来打开你的项目选择SSH,然后复制右边git开头的地址

image

打开站点配置文件

修改deploy信息

deploy:
  type: git
  repo: 你复制的地址
  branch: master

例如:

image

在博客根目录下打开git bash

分别执行下面的命令:

yourname是你的名字

youremail是你的邮箱

$ git config --global user.name "yourname"
$ git config --global user.email "youremail"

然后安装上传插件

cnpm install hexo-deployer-git --save

上传

以上的配置完成之后,就可以上传了

在博客根目录下打开git bash,执行下面的命令就可以上传了

hexo g -d

image

然后打开项目,打开构建与部署–静态网站–立即发布静态网站

注意:coding需要实名认证,只需要你输入身份证号就可以了,不用担心泄露隐私,因为coding现在是腾讯的

image

我们只要填写网站名称就行了,然后保存

image

因为是刚构建的网站,所以要手动部署一下,以后上传就不需要手动部署

image

然后访问所给的地址,那个就是我们网站的地址了

image

之后每次修改完博客要上传的时候,只需执行上传命令

2.github部署(推荐)

你还可以使用github部署你的博客

这里不演示如何注册账号

创建一个仓库

image

仓库名必须是用户名 + .github.io

然后勾选初始化README

image

我们暂时不能直接上传,需要进行一些配置,如下:

接下来需要我们创建一个git秘钥

打开git bash(不要求在哪个目录)

执行: “这里面是你的邮箱”

不管出现什么信息,你只需要回车就可以了

$ ssh-keygen -t rsa -C “your_email@youremail.com“

然后执行

$ cat ~/.ssh/id_rsa.pub

会输出你的秘钥,我们复制输出信息就行了

image-20250317195927038

然后点击头像,点击Settings–SSH·····–New SSH Key

image

粘贴你复制的秘钥,title应该可以随便写,笔者写的myblog

image

然后打开git bash

执行:

$  ssh -T git@github.com

会提示你下面这个,输入yes回车就行了

Are you sure you want to continue connecting (yes/no/[fingerprint])? 

打开项目,点击绿色按钮,点击Use SSH

image

复制git开头的地址

image

打开站点配置文件,点击总的_config.yml,不要去你自己的那个_config.butterfly.yml

修改deploy信息

deploy:
  type: git
  repo: 你复制的地址
  branch: master

例如:

image

在博客根目录下打开git bash

分别执行下面的命令:

yourname是你的名字

youremail是你的邮箱

$ git config --global user.name "yourname"
$ git config --global user.email "youremail"

然后安装上传插件

cnpm install hexo-deployer-git --save

image-20250317200326930

部署到github上面

以上的配置完成之后,就可以部署了

在博客根目录下打开git bash,执行下面的命令就可以部署了

hexo g -d 

image

3.得到自己的网址

原作者的操作

然后打开项目,点击Settings

image

往下滑找到Github pages

点击none 选择master branch

image

之后你会得到一个地址,这个就是你的网站地址了

image

笔者的操作

image-20250317200707247

笔者默认的分支就是master,所以不需要改动,执行完hexo g -d就直接有了下面的网址

先点击左侧pages

然后出现以下页面

image-20250317200822674

主要是要出现这个

image-20250317200852827

就是咱们自己的网址

笔者的就是https://darling-123456.github.io/

看看效果

image-20250317201024205

image-20250317201039600

至于美化和上传博客,等我学会了会再写一篇博客教大家,也不会太久,大概就在本周之内解决吧

教程到此结束

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2317267.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

pandas学习笔记(一)——基础知识和应用案例

pandas学习笔记 基础语法参考菜鸟教程:https://www.runoob.com/pandas/pandas-tutorial.html # jupyter import pandas as pd import matplotlib from matplotlib import pyplot as plt import numpy as npmatplotlib.use(TkAgg)data {timestamp: [1, 2, 3, 4, 5…

【AI 大模型】RAG 检索增强生成 ⑤ ( 向量数据库 | 向量数据库 索引结构和搜索算法 | 常见 向量数据库 对比 | 安装并使用 向量数据库 chromadb 案例 )

文章目录 一、向量数据库1、向量数据库引入2、向量数据库简介3、向量数据库 索引结构和搜索算法4、向量数据库 应用场景5、传统数据库 与 向量数据库 对比 二、常见 向量数据库 对比三、向量数据库 案例1、安装 向量数据库 chromadb2、核心要点 解析① 创建数据库实例② 创建数…

解决single cell portal点击下载但跳转的是网页

Single cell RNA-seq of Tmem100-lineage cells in a mouse model of osseointegration - Single Cell Portal 想下载个小鼠数据集: 点击下载跳转为网页: 复制bulk download给的链接无法下载 bulk download给的原链接: curl.exe "http…

基于 Prometheus + Grafana 监控微服务和数据库

以下是基于 Prometheus Grafana 监控微服务和数据库的详细指南&#xff0c;包含架构设计、安装配置及验证步骤&#xff1a; 一、整体架构设计 二、监控微服务 1. 微服务指标暴露 Spring Boot 应用&#xff1a; xml <!-- 添加 Micrometer 依赖 --> <dependency>…

CAN总线的CC帧和FD帧之间如何仲裁

为满足CAN总线日益提高的带宽需求&#xff0c;博世公司于2012年推出CAN FD&#xff08;具有灵活数据速率的CAN&#xff09;标准&#xff0c;国际标准化组织&#xff08;ISO&#xff09;2015年通过ISO 11898-1:2015标准&#xff0c;正式将CAN FD纳入国际标准&#xff0c;以示区别…

SpringBoot 第一课(Ⅲ) 配置类注解

目录 一、PropertySource 二、ImportResource ①SpringConfig &#xff08;Spring框架全注解&#xff09; ②ImportResource注解实现 三、Bean 四、多配置文件 多Profile文件的使用 文件命名约定&#xff1a; 激活Profile&#xff1a; YAML文件支持多文档块&#xff…

Excel(函数篇):COUNTIF与CONUTIFS函数、SUMIF与SUMIFS函数、ROUND函数、MATCH与INDEX函数、混合引用与条件格式

目录 COUNTIF和COUNTIFS函数COUNTIF函数COUNTIFS函数SUMIF和SUMIFS函数SUMIF函数SUMIFS函数SUMIFS函数与控件实现动态年月汇总ROUND、ROUNDUP、ROUNDDOWN函数单元格混合引用条件格式与公式,标记整行数据MATCH和INDEX函数COUNTIF和COUNTIFS函数 COUNTIF函数 统计下“苏州”出现…

虚拟定位 1.2.0.2 | 虚拟定位,上班打卡,校园跑步模拟

Fake Location是一款运行于安卓平台上的功能强大、简单实用的虚拟定位软件。它能够帮助用户自定义位置到地图上的任意地方&#xff0c;以ROOT环境运行不易被检测&#xff0c;同时也支持免ROOT运行。提供路线模拟、步频模拟、WIFI模拟等方式&#xff0c;支持反检测。 大小&…

【最大异或和——可持久化Trie】

题目 代码 #include <bits/stdc.h> using namespace std;const int N 6e510; //注意这里起始有3e5&#xff0c;又可能插入3e5 const int M N * 25;int rt[N], tr[M][2]; //根&#xff0c;trie int idx, cnt, br[M]; //根分配器&#xff0c;点分配器&#xff0c;点的相…

C# WPF编程-启动新窗口

C# WPF编程-启动新窗口 新建窗口&#xff1a; 工程》添加》窗口 命名并添加新的窗口 这里窗口名称为Window1.xaml 启动新窗口 Window1 win1 new Window1(); win1.Show(); // 非模态启动窗口win1.ShowDialog(); // 模态启动窗口 模态窗口&#xff1a;当一个模态窗口被打开时&a…

Python 实现大文件的高并发下载

项目背景 基于一个 scrapy-redis 搭建的分布式系统&#xff0c;所有item都通过重写 pipeline 存储到 redis 的 list 中。这里我通过代码演示如何基于线程池 协程实现对 item 的中文件下载。 Item 结构 目的是为了下载 item 中 attachments 保存的附件内容。 {"crawl_tim…

【最新】 ubuntu24安装 1panel 保姆级教程

系统&#xff1a;ubuntu24.04.1 安装软件 &#xff1a;1panel 第一步&#xff1a;更新系统 sudo apt update sudo apt upgrade 如下图 第二步&#xff1a;安装1panel&#xff0c;运行如下命令 curl -sSL https://resource.fit2cloud.com/1panel/package/quick_start.sh -o …

c++图论(二)之图的存储图解

在 C 中实现图的存储时&#xff0c;常用的方法包括 邻接矩阵&#xff08;Adjacency Matrix&#xff09;、邻接表&#xff08;Adjacency List&#xff09; 和 边列表&#xff08;Edge List&#xff09;。以下是具体实现方法、优缺点分析及代码示例&#xff1a; 1. 邻接矩阵&…

c++图论(一)之图论的起源和图的概念

C 图论之图论的起源和图的概念 图论&#xff08;Graph Theory&#xff09;是数学和计算机科学中的一个重要分支&#xff0c;其起源可以追溯到 18 世纪 的经典问题。以下是图论的历史背景、核心起源问题及其与基本概念和用途&#xff1a; 借用一下CSDN的图片哈 一、图论的起源&…

ChatGPT and Claude国内使用站点

RawChat kelaode chatgptplus chatopens&#xff08;4.o mini免费&#xff0c;plus收费&#xff09; 网页&#xff1a; 定价&#xff1a; wildcard 网页&#xff1a; 虚拟卡定价&#xff1a; 2233.ai 网页&#xff1a; 定价&#xff1a; MaynorAPI chatgpt cla…

进行性核上性麻痹:精心护理,点亮希望之光

进行性核上性麻痹是一种罕见的神经退行性疾病&#xff0c;严重影响患者的生活质量。有效的健康护理能够在一定程度上缓解症状、延缓病情发展&#xff0c;给患者带来更好的生活体验。 在日常生活护理方面&#xff0c;由于患者平衡能力逐渐下降&#xff0c;行动不便&#xff0c;居…

ZED X系列双目3D相机的耐用性与创新设计解析

在工业自动化和学术研究领域&#xff0c;高精度的视觉设备正成为提升效率和质量的关键。ZED X系列AI立体相机&#xff0c;凭借其先进的技术和耐用的设计&#xff0c;为这一领域带来了新的可能。 核心技术&#xff1a;深度感知与精准追踪 ZED X系列的核心技术之一是Neural Dept…

HarmonyOS三层架构实战

目录&#xff1a; 1、三层架构项目结构1.0、三层架构简介1.1、 common层&#xff08;主要放一些公共的资源等&#xff09;1.2、 features层&#xff08;主要模块定义的组件以及图片等静态资源&#xff09;1.3、 products层&#xff08;主要放主页面层和一些主要的资源&#xff…

计算机四级 - 数据库原理 - 第4章 「关系数据库标准语言SQL」

4.1 SQL概述 4.1.1 结构化查询语言SQL SQL(Structured Query Language)称为结构化查询语言&#xff0c;它是由1974年由Boyce和Chamberi提出的&#xff0c;1975年至1979年IBM公司的San Jose Research Laboratory研制了关系数据库管理系统的原型系统System R,并实现了这种语198…

基于PMU的14节点、30节点电力系统状态估计MATLAB程序

“电气仔推送”获得资料&#xff08;专享优惠&#xff09; 程序简介&#xff1a; 程序采用三种方法对14节点和30节点电力系统状态进行评估&#xff1a; ①PMU同步向量测量单元结合加权最小二乘法&#xff08;WLS&#xff09;分析电力系统的电压幅值和相角状态&#xff1b; …