• 安装 node.js 环境

  node > 16.16.0
  npm > 8.15.0

• 然后以 管理员权限 运行 cmd 终端，并 cd 到 项目根目录

• 在 终端 中输入：

# 安装 pnpm
npm install -g pnpm

# 安装依赖
pnpm install

# 预览
pnpm dev

# 构建
pnpm build

构建完成后，静态资源会在 dist 目录 中生成，可将 dist 文件夹下的文件上传至服务器，也可使用 Vercel 等托管平台一键导入并自动部署

在 src/assets/siteLinks.json 中可以自定义网站链接（以指向自己的网站）:

{
  "icon": "Blog",
  "name": "博客",
  "link": "https://blog.imsyy.top/"
},

其中 icon 网站链接的图标可以在 src/components/Links.vue 中添加:

// 可前往 https://www.xicons.org 自行挑选并在此处引入
// 此处引入的是 fa 类型
import {
  Link,
  Blog,
  CompactDisc,
  Cloud,
  Compass,
  Book,
  Fire,
  LaptopCode,
} from "@vicons/fa";

...

// 网站链接图标
const siteIcon = {
  Blog,
  Cloud,
  CompactDisc,
  Compass,
  Book,
  Fire,
  LaptopCode,
};

在 src/assets/socialLinks.json 中可以自定义社交链接。

可以在 public/images 中修改网站背景

如果想要添加更多的本地图片作为网站背景，可以将图片重命名 background+数字 的形式，并在 src/components/Background/index.vue 中进行修改：

if (type == 0) {
  // 修改此处 Math.random() 后面的第一个数字为图片的数量
  bgUrl.value = `/images/background${Math.floor(Math.random() * 10 + 1)}.webp`;
}