656 字
2 分钟
博客搭建
博客搭建教程
Gmeek博客搭建
Gmeek的博客搭建是最简单的,只需要一个Github账号,并且Gmeek完全基于Github Pages与Github Actions不用在本地部署进行
NOTE以下是Gmeek的Github仓库
Waiting for api.github.com...
并且有着UP主技术爬爬虾制作的教程视频
所以我在这里就不提供详细的教程了
以下是Mizuki的部署教程
Mizuki是基于Astro框架的博客,需要本地部署配置后发布到Github仓库,特别繁琐
以下是Mizuki仓库
Waiting for api.github.com...
TIPMizuki有官方教程文档,有能力的可以对着教程文档自己做
首先,你需要克隆Mizuki仓库到你的本地,无论你是用Git还是自己直接去仓库下载ZIP压缩包,然后你还需要下载Node.js进行环境配置。
TIP本文章特殊颜色带有下划线的字体均为跳转链接,点击即跳转
安装完成后,打开终端或命令提示符,运行以下命令验证 Node.js 是否安装成功:
node -vnpm -v并且需要在Mizuki根目录下安装pnpm
npm install -g pnpm并验证是否安装成功
pnpm -v上面操作如果显示版本号即为成功安装
接下来打开src目录下的config.ts文件,进行个人信息配置站点配置说明
个人推荐使用VScode来进行操作,
站点配置位于src/config.ts文件中的 siteConfig 对象,控制博客的基本信息和全局设置。
基本配置信息
// 定义站点语言const SITE_LANG = "zh_CN"; // 语言代码,例如:'en', 'zh_CN', 'ja' 等。
export const siteConfig: SiteConfig = { title: "Mizuki", // 网站标题 subtitle: "One demo website", // 网站副标题 lang: SITE_LANG, // 不需要配置,会根据 SITE_LANG 自动设置}title:网站的主标题,显示在浏览器标签页和页面头部subtitle:网站的副标题,通常显示在主页横幅下方lang:网站的默认语言,影响日期格式、翻译等功能
个人信息配置
个人资料配置位于 src/config.ts 文件中的 profileConfig 对象,控制网站侧边栏中的个人信息显示。
TIP可以按Ctal+F打开搜索方便查找代码位置
export const profileConfig: ProfileConfig = { avatar: "assets/images/avatar.jpg", // 头像图片路径 name: "Mizuki", // 用户名 bio: "This is a description", // 个人简介 links: [ // 社交链接 { name: "Bilibli", // 链接名称 icon: "fa6-brands:bilibili", // 图标 url: "https://space.bilibili.com/701864046", // 链接地址 }, // ... 更多链接 ],};头像设置
avatar:头像图片路径,相对于 /src 目录,如果路径以 / 开头,则相对于 /public 目录 建议使用正方形图片以获得最佳显示效果 基本信息name:显示在头像下方的用户名bio:个人简介,显示在用户名下方
社交链接
links: [ { name: "Bilibli", // 链接名称 icon: "fa6-brands:bilibili", // 图标名称 url: "https://space.bilibili.com/701864046", // 链接地址 }, { name: "Gitee", // 链接名称 icon: "mdi:git", // 图标名称 url: "https://gitee.com/matsuzakayuki", // 链接地址 }, { name: "GitHub", // 链接名称 icon: "fa6-brands:github", // 图标名称 url: "https://github.com/matsuzaka-yuki", // 链接地址 },]配置完后用命令行来到Mizuki根目录进行构建网页
pnpm dev大功告成~ 就到这吧,更多请到官方文档自行学习
部分信息可能已经过时



.webp)