Hexo建站指南-2，Hexo的基本使用

Hexo建站指南

步骤二：Hexo的基本使用

“硬件使机器快速。软件使快速的机器变慢。”

安知鱼主题官方文档

Hexo-Theme-Acrylic

Hexo

文档 | Hexo

初始化项目

你需要准备

  • nodejs（可以去我的博客看nodejs的安装教程）
  • IDE：这里推荐使用VS Code或者Webstorm

安装Hexo脚手架

image-20230909100730865

看到最中间那个最显眼的npm install hexo-cli -g吗，将它复制到cmd中运行，运行结束为下图所示：

image-20230909101000074

至此Hexo脚手架安装完成

初始化项目

在你想要创建项目的位置打开cmd，输入以下命令：

1
hexo init [你的项目工程文件夹]

即可开始初始化项目

image-20230909101219981

初始化完毕将会看到如下信息：

image-20230909101317612

同时，此处将会出现你的项目目录：

image-20230909101428788

目录结构

基本目录结构

使用WebStrom打开你创建的工程，你会看到如下目录：

image-20230909102133172

使用hexo g编译命令，将会把所有的资源进行打包发布，生成的文件将会存放在public文件夹下

image-20230909102438899

使用hexo d提交命令，将会把所有已经打包好的资源进行提交，生成的文件将会存放在.deploy_xxx下，这个xxx是你填写的提交方式

image-20230909102913456

目录详解

文件夹/文件 作用 内容
_config.yml 全局配置文件，定义Hexo网站的属性和选项 网站标题、描述、作者信息、URL等配置选项
source 存放网站的源文件，如文章、页面、图片等 Markdown格式的文章和页面文件，资源文件
themes 存放Hexo网站的主题 主题文件夹，包括模板、样式、配置文件等
scaffolds 存放预设的模板文件，用于创建新文章或页面时的默认模板 文章和页面的默认模板文件
db.json 存放Hexo网站的数据缓存文件 记录文章和页面的元数据信息的JSON数据
node_modules 存放Node.js模块和依赖 Hexo及其插件所需的JavaScript模块
public 存放生成的静态网站文件，Hexo构建后生成的网站内容 HTML页面、样式表、JavaScript文件、图片等静态资源
package.json Node.js项目的配置文件，记录项目依赖和构建脚本 项目依赖、脚本命令等信息

主题

安装主题

  1. 安装AnZhiYu主题

    1
    git clone -b main https://github.com/anzhiyu-c/hexo-theme-anzhiyu.git themes/anzhiyu

  2. 可以看到/themes/下已经生成了anzhiyu文件夹

    image-20230909195303318

  3. 安装pug和stylus渲染插件

    1
    npm install hexo-renderer-pug hexo-renderer-stylus --save

使用主题

  1. 在_config.yml中编辑theme: anzhiyu，即可切换到Anzhiyu主题

  2. 使用hexo g编译生成静态文件

  3. 使用hexo s编译运行

    你可以通过hexo s -p [端口号]来指定运行的端口号

    image-20230909195632718

  4. 浏览器中访问该地址来查看运行情况

    image-20230909200324774