首页

# 环境准备

# 安装vscode

拿来写代码的,看下面视频的前3分钟就行,汉化完即可

vscode使用教程_哔哩哔哩_bilibili

# 安装node.js

Node.js — 下载 Node.js®

参考Node.js 安装教程_

获得适用于Windows且使用Docker和npm的 Node.js®v24.16.0LTS

选择.msi安装 然后就一路next即可

屏幕截图 2026-06-02 215713.png

然后依次执行 命令 看到有输出即可

npm -v
npm install -g pnpm

# 安装 git

Git - Install for Windows

参考Git安装教程_哔哩哔哩_

屏幕截图 2026-06-02 220226.png

# 安装Github desktop

目的是为了简化提交代码流程

Download GitHub Desktop | GitHub Desktop

然后就是登录即可

看不懂英语可以使用 Github Desktop 汉化工具

# 拉取代码

  1. 打开项目地址,选择复刻该项目

屏幕截图 2026-06-02 225936.png

  1. 打开GitHub desktop

  2. 左上角 file->clone a repository->选择刚刚复刻的项目clone,local path要选一个你方便找到的位置

  3. 复刻后依次执行下列命令：

    npm install -g pnpm
pnpm add hexo-cli -g
pnpm install
hexo s # 如果报错更换为 pnpm dlx hexo s

  4. ok 这样就算是结束了,代码就在你刚刚选择的位置

# 写在前面

​ 看起来项目代码很多很复杂,但大部分其实都是已经现成的网页显示代码.而我们真正要用到的文件其实只有这些,其余的基本不需要关注

  1. _config.yml 用来修改站点信息
  2. source\ _data 用来存放图片相关资源
  3. source\ _posts 用来存放文章

# 修改站点信息

# 配置信息

  1. 打开根目录下的 _config文件,可以看到这一部分.就是站点的基本信息,自己修改成想要的内容即可,保存后重启终端,再次执行hexo s命令重新进入网站即可看到效果
image-20260602231526164

# 修改图片

  1. 将准备好的图片放到 source\ _data\assets文件夹下
  2. 然后修改images_index,这个是记录主页最上方图片的地方. 每次会从这里面选几张图片播放
  3. 然后是images文件,当写的文章但没有手动添加封面时,就会从这里面随机挑一张作为封面
  4. 关于头像的修改,先到 source\ _data\assets文件夹下添加头像图片,然后修改根目录下的 _config.shokax 文件
把sidebar:
  avatar: avatar.webp
改成
sidebar:
  avatar: 你想要的头像文件位置

# 写文章

  1. 在shokax-blog\source \_posts 文件夹下新建一个markdown文件,使用markdown写文章, markdown是一个非常好的写作语言,做笔记也很好用😸

    参考:8分钟让你快速掌握Markdown_哔哩哔哩_bilibili, 看前3分钟就好了

  2. 不过,注意需要在最开头添加文章的基本信息

    最开头的一对 ---（上下各一行，单独成行）

    中间写 YAML 格式的字段，比如：

    ---
title: 改成你的文章标题
date: 2025-10-24 20:00:00
tag: 标签
cover: 可以选择_data/assets文件夹里的图片作为封面
---

    这一块不会被当作正文渲染，而是被程序读取为文章的标题、日期、标签封面 等元数据。

  3. 写完文章后,打开github desktop, commit to main 然后push 即可看到文章被推送

# 部署服务到vercel

完成上面的工作后,服务依然停留在本地.此时可以利用vercel的免费站点托管服务来托管项目到云端

  1. 注册Vercel账户:
    • 访问 Vercel官网 并点击“Sign Up”注册一个账户。您可以使用电子邮件或GitHub账户进行注册。
  2. 通过GitHub部署:
    • 在Vercel的控制台中，点击“Add New Project”按钮，选择“Import Git Repository”。
    • 连接您的GitHub账户，选择要部署的项目仓库。Vercel会自动识别项目的框架和构建命令
    • 点击“Deploy”按钮，等待构建完成，Vercel会为您提供一个独特的预览地址,通过这个地址我们就能访问到自己的网站了

# 添加域名解析

域名解析:

  • 如果您希望使用自定义域名，可以在Vercel中进行域名绑定，并根据需要配置DNS解析。Vercel提供的默认域名在中国大陆可能会有访问速度慢的问题，建议使用自有域名并搭配国内的DNS/CDN加速
  1. 访问阿里云域名注册 ,购买注册一个你自己喜欢的域名并完成实名认证
  2. 访问 控制台->域名与网站->全部域名
  3. 选择刚刚的域名,解析
  4. 添加记录