【详细教程hexo博客搭建】1、从零开始搭建一个能用的博客

2023-09-17 19:24:31

1、开始

2.环境与工具准备

本教程主要面对的是Windows用户

  • 操作系统：Windows10
  • Node
  • Git
  • Hexo
  • 文本编辑器(强烈推荐VSCODE)
  • GitHub 帐号
  • 一个域名（强烈推荐买个域名）
  • 云服务器（可选）

image-20221027113923949

3.Node的安装

  1. 打开Node官网，下载和自己系统相配的Node的安装程序，否则会出现安装问题。下载地址：Download | Node.js
    我个人的版本是 12.19.0，目前版本已经更新到19.0.0，按照个人经验，可以选个低一些的版本，可以和我的一样，否则后面会出现各种不兼容的问题！我之前就是安装16的，系统无法识别，如果大家遇到问题建议选个低版本的！历史版本下载页面：Previous Releases | Node.js

    image-20221027173738226

  2. 下载后安装，安装的目录可以使用默认目录【C:/Program Files/nodejs/】，也可以自定义路径。
    这个环境路径切换坑也很多，如果大家C盘空间足够可以直接装C盘，如果想切换其他盘或者把环境遍历切换到自定义路径也可以，具体教程百度(不过坑比较多就是了)!
  3. 安装完成后，检查是否安装成功。在键盘按下win + R键，输入CMD，然后回车，打开CMD窗口，执行node -v命令，看到版本信息，则说明安装成功。
  4. 修改npm源。npm下载各种模块，默认是从国处服务器下载，速度较慢，建议配置成淘宝镜像。打开CMD窗口，运行如下命令:

    SHELL

    1

    npm config set registry https://registry.npm.taobao.org

4.安装Hexo

  1. 在Git BASH输入如下命令安装

    SHELL

    1

    npm install -g hexo-cli

  2. 安装完后输入hexo -v验证是否安装成功。

image-20221027173525181

5.Github注册与创建仓库

  1. 进入官网 GitHub: Let’s build from here · GitHub

    Github注册

  2. 点击右上角的 Sign up(注册)

    Github注册

  3. 填写自己的邮箱、密码、用户名等信息，然后用邮箱验证即可完成。
  4. 注册完成后，点击右上角的+按钮，选择New repository，创建一个<用户名>.github.io的仓库。

​

image-20221027110619071

  • 仓库的格式必须为：<用户名>.github.io (注意：前缀必须为用户名，不要等后面404了再来为什么！！！)
  • Description：为描述仓库（选填）
  • 勾选 Initialize this repository with a README 初始化一个 README.md 文件
  • 点击 Creat repository 进行创建

​

image-20221027111641909

6.Git安装

  1. 进入官网：Git - Downloads ，由于官网下载太慢可以通过淘宝的开源镜像下载 网址：CNPM Binaries Mirror ，下载版本更具自己的需求选择即可。

    image-20221027111755697

  2. 下载后傻瓜式安装Git即可，安装的目录可以使用默认目录【C:/Program Files/Git】，也可以自定义路径。

  3. 点击电脑左下角开始即可看见Git Bash。

Git Bash

  • Git CMD 是windows 命令行的指令风格
  • Git Bash 是linux系统的指令风格（建议使用）
  • Git GUI是图形化界面（新手学习不建议使用）

  1. 常用命令

    SHELL

    1
2
3

    git config -l  //查看所有配置
git config --system --list //查看系统配置
git config --global --list //查看用户（全局）配置

  2. 配置用户名和邮箱

    SHELL

    1
2

    git config --global user.name "你的用户名"
git config --global user.email "你的邮箱"

  3. 通过git config -l 检查是否配置成功，至此git安装及配置全部完成。

    image-20221027112049822

7.连接至Github

  1. 执行以下命令生成ssh公钥，此公钥用于你的计算机连接Github

    SHELL

    1

    ssh-keygen -t rsa -C "你的邮箱"

    之后打开C盘下用户文件夹下的.ssh的文件夹，会看到 id_rsa.pub

    公钥

    用记事本打开上述图片中的公钥（id_rsa.pub），复制里面的内容，然后开始在github中配置ssh密钥。

    记事本打开公钥

  2. 将 SSH KEY 配置到 GitHub
    进入github，点击右上角头像 选择settings，进入设置页后选择 SSH and GPG keys，名字随便起，公钥填到Key那一栏。

    image-20221027112347632

    image-20221027112416710

    image-20221027112657256

  3. 测试连接，输入以下命令

    SHELL

    1

    ssh -T git@github.com

    image-20221027112918539

    出现连接到账户的信息，说明已经大功告成，至此完成了环境准备工作。

8.初始化 Hexo 项目

  1. 在目标路径（我这里选的路径为【C:/Hexo-Blog】）打开cmd命令窗口，执行hexo init初始化项目。

    SHELL

    1

    hexo init blog-demo(项目名)

    image-20221027113206776

  2. 进入blog-demo ，输入npm i安装相关依赖。

    SHELL

    1
2

    cd blog-demo  //进入blog-demo文件夹
npm i

    image-20221027113331624

  3. 初始化项目后，blog-demo有如下结构：

image-20221027113438707

【node_modules】：依赖包
【scaffolds】：生成文章的一些模板
【source】：用来存放你的文章
【themes】：主题
【.npmignore】：发布时忽略的文件（可忽略）
【_config.landscape.yml】：主题的配置文件
【config.yml】：博客的配置文件
【package.json】：项目名称、描述、版本、运行和开发等信息

  1. 输入hexo server或者hexo s 启动项目

    image-20221027113534970

  2. 打开浏览器，输入地址：http://localhost:4000/ ，看到下面的效果，说明你的博客已经构建成功了。

    博客首页

9. 将静态博客挂载到 GitHub Pages

  1. 安装 hexo-deployer-git

    SHELL

    1

    npm install hexo-deployer-git --save

  2. 修改 _config.yml 文件
    在blog-demo目录下的_config.yml，就是整个Hexo框架的配置文件了。可以在里面修改大部分的配置。详细可参考官方的配置描述。
    修改最后一行的配置，将repository修改为你自己的github项目地址即可，还有分支要改为main代表主分支（注意缩进）。

    YAML

    1
2
3
4

    deploy:
  type: git
  repository: git@github.com:Fomalhaut-Blog/Fomalhaut-Blog.github.io.git
  branch: main

  3. 修改好配置后，运行如下命令，将代码部署到 GitHub（Hexo三连）。

    SHELL

    1
2

    hexo clean && hexo generate && hexo deploy  // Git BASH终端
hexo clean; hexo generate; hexo deploy  // VSCODE终端

    • hexo clean：删除之前生成的文件，若未生成过静态文件，可忽略此命令。

    • hexo generate：生成静态文章，可以用hexo g缩写

    • hexo deploy：部署文章，可以用hexo d缩写

      image-20221027113704801

      注意：deploy时可能要你输入 username 和 password。

      如果出现Deploy done，则说明部署成功了。

      image-20221027113756069

      稍等两分钟，打开浏览器访问：https://Fomalhaut-Blog.github.io ，这时候我们就可以看到博客内容了。

更多推荐

【机器学习】详解回归（Regression）

文章目录是什么的问题案例说明是什么的问题回归分析（RegressionAnalysis）是研究自变量与因变量之间数量变化关系的一种分析方法，它主要是通过因变量Y与影响它的自变量Xi（i1,2,3…）X_i（i1,2,3…）Xi​（i1,2,3…）之间的回归模型，衡量自变量XiX_iXi​对因变量Y的影响能力的，进而可以

【SpringCloud】微服务技术栈入门1 - 远程服务调用、Eureka以及Ribbon

目录远程服务调用RestTemplateEureka简要概念配置Eureka环境设置EurekaClientEureka服务发现Ribbon工作流程配置与使用Ribbon饥饿加载远程服务调用RestTemplateRestTemplate可以模拟客户端来向另外一个后端执行请求黑马给出的微服务项目中，有两个boot项目，

03使用Spring基于XML的方式注册第一个组件

基于XML的方式注册第一个组件开发步骤第一步:创建Maven工程配置生成的pom.xml文件,添加springcontext基础依赖和junit依赖(注意根据Spring官方文档描述,Spring6需要JDK版本17)当添加Spring的基础依赖springcontext之后,Maven会自动关联并引入其他依赖spri

M2 MacbookPro配置Spark源码运行环境

零、版本信息MacBook：MacBookProM2JDK：1.8.0_381Scala：2.12.15Maven：3.6.3Homebrew：4.1.12（可选，下载Git需要）Git：2.42.0（下载Spark源码需要）Spark：3.2.5整体配置流程参考@来自遥远的水星【Spark源码01【搭建Spark源码

用什么命令看Linux系统的体系架构

要查看Linux系统的体系架构，可以使用uname命令。在终端中运行以下命令：uname-m该命令将返回系统的体系架构，例如x86_64表示64位系统，i686表示32位系统。uname使用方法uname命令用于获取操作系统的相关信息。它可以用于显示操作系统的名称、内核版本、主机名、硬件架构等信息。以下是uname命令

uniapp cors错误

CORS（跨源资源共享）错误通常出现在前端应用程序尝试从不同源（域）请求数据时。这些错误是出于安全考虑而存在的，以防止潜在的恶意攻击。如果你在UniApp中遇到CORS错误，可以尝试以下解决方法：检查服务器端设置：首先，请确保服务器端允许跨域请求。服务器应该在响应头中包含适当的CORS标头，允许来自UniApp应用程序

广州某机械制造企业生产工序管理系统解决方案

RFID工序管理解决方案在生产工序中引入RFID技术，对生产工序的构件拼装、焊接、打磨后检测、打砂油漆后检测、构件拟装读取确认、项目管理人员收货确认等各个生产环节的数据进行自动化的数据采集，保证生产管理各个作业环节数据输入的效率和准确性，确保企业及时准确地掌握项目生产的真实数据，合理控制各个项目的顺利进展。根据企业对I

MySQL中如何识别低效的索引

我是一个目录前言(可以跳过直接看正文)索引的基本原理索引设计的原则创建索引的原则正文使用索引查询一定能提高查询的性能吗？怎样查看索引是否有高选择性？用一条SQL查看低效的索引前言(可以跳过直接看正文)索引的基本原理索引用来快速地寻找那些具有特定值的记录。如果没有索引，一般来说执行查询时遍历整张表。索引的原理很简单，就是

Mysql表的约束

目录一、NULL约束二、default约束三、comment四、zerofill五、primarykey六、auto_increment七、唯一键八、外键为了保证数据的完整性和可预期性，表中一定要有各种约束，通过约束，让我们未来插入数据库表中的数据是符合预期的。表的约束很多，这里主要介绍以下几个约束:null/notn

软件测试7大误区

随着软件测试对提高软件质量重要性的不断提高，软件测试也不断受到重视。但是，国内软件测试过程的不规范，重视开发和轻视测试的现象依旧存在。因此，对于软件测试的重要性、测试方法和测试过程等方面都存在很多不恰当的认识，这将会进一步的影响软件测试活动的开展，并且阻碍软件测试质量的提高。下面简单列举了几种有代表性的对软件测试的认识

typeof的作用

typeof是JavaScript中的一种运算符，用于获取给定值的数据类型。它的作用是返回一个字符串，表示目标值的数据类型。通过使用typeof运算符，我们可以在运行时确定一个值的类型，从而进行相应的处理或逻辑判断。常见的数据类型包括："undefined"：未定义的值"boolean"：布尔值"number"：数字"

热文推荐
  1. Vue-devTools安装—创建项目方法2 ui创建——Vue指令综合案例——汽车品牌管理

    目录项目源代码：一、vue-devTools安装二、案例功能实现1、新建项目（ui创建）2、cnpm导入项目依赖库3、删除不需要的代码结构:4、修改代码结构5、添加汽车品牌插件安装bootstrap的提示功能添加bootstrap样式6、删除汽车品牌7、查询汽车品牌(过滤)项目源代码：Vue指令综合案例——汽车品牌管理

  2. （二十九）大数据实战——kafka集群节点服役与退役案例实战

    前言本节内容是关于kafka集群节点的服役与退役，从而实现kafka集群的缩容与扩容。在开始本节内容之前，我们要预先安装好kafka集群，并准备一台空余的服务器用来完成我们扩容与缩容的案例。关于kafka集群的安装内容这里不在赘述，相关内容请查看作者往期博客内容。正文从hadoop103克隆一台空闲服务器hadoop1

  3. QT信号槽实现原理

    定义Q_OBJECT宏在宏中声明了几个重要的成员变量及成员函数，包括声明了一个只读的静态成员变量staticMetaObject，以及3个public的成员函数staticconstQMetaObjectstaticMetaObject;virtualconstQMetaObject*metaObject()const

  4. 低代码之IVX

    低代码之IVX一、如何去分析不同的低代码平台🧝‍♂️1.看自己的网站和平台是不是通过自己的低代码/无代码平台生成的2.生成源代码的能力3.可视化的逻辑编排二、低代码平台未来的发展方向👨‍🌾三、优质低代码平台介绍👨‍💼1.什么是iVX:2.iVX和其它低代码平台的区别上手步骤1.1iVX线上集成环境进入1.2创

  5. python爬虫——爬取豆瓣top250电影数据（适合初学者）

    前言：爬取豆瓣top250其实是初学者用于练习和熟悉爬虫技能知识的简单实战项目，通过这个项目，可以让小白对爬虫有一个初步认识，因此，如果你已经接触过爬虫有些时间了，可以跳过该项目，选择更有挑战性的实战项目来提升技能。当然，如果你是小白，这个项目就再适合不过了。那么就让我们开始吧！目录一、实战1.对豆瓣网网站进行Ajax

  6. 数据库设计与建模

    数据库设计与建模1数据库设计的三范式2数据库建模2.1建模工具2.2使用pd建模1数据库设计的三范式三范式：1.第一范式（1NF）：确保每一列的原子性（做到每列不可拆分）2.第二范式（2NF）：在第一范式的基础上，非主字段必须依赖于主字段（一个表只做一件事）3.第三范式（3NF）：在第二范式的基础上，消除传递依赖反三范

  7. IOS数据管理

    在iOS中，没有直接与Android中的SharePreference相对应的概念。而是使用不同的机制来处理应用程序的持久化数据。在iOS中，你可以使用以下几种方法来保存和读取应用程序的数据：UserDefaults（用户默认设置）：UserDefaults提供了一种简单的键值存储机制，用于存储应用程序的配置和用户偏好

  8. 【Jetpack】Navigation 导航组件 ③ ( 为 Navigation Graph 页面跳转 action 添加跳转动画 )

    文章目录一、为NavigationGraph添加跳转动画1、进入NavigationGraph配置的Design模式2、选中action跳转3、为action跳转设置enterAnim进入动画4、为action跳转设置exitAnim退出动画5、通过代码为action跳转设置进入/退出动画6、执行效果代码地址:CSDN

  9. Qt/C++音视频开发54-视频监控控件的极致设计

    一、前言跌跌撞撞摸爬滚打一步步迭代完善到今天，这个视频监控控件的设计，在现阶段水平上个人认为是做的最棒的（稍微自恋一下），理论上来说应该可以用5年不用推翻重写，推翻重写当然也是程序员爱干的事情，这个就要考验个人的功底，设计的好框架搭建的好，可以很多年不用变，只需要在现有框架小修小补即可，最多就是继承基类实现一些特殊性的