# docs

**Repository Path**: wudandong/docs

## Basic Information

- **Project Name**: docs
- **Description**: 使用press默认配置的关于前端开发规范的文档
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2020-12-07
- **Last Updated**: 2025-12-03

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# wudandong

## 项目名称

wudandong 个人网站

## 运行条件

* Node.js - v18.17.1 或 v20.3.0 或更高版本。（不支持 v19.）

## 运行说明

* 安装依赖 `pnpm i`

* 启动调试 `pnpm run dev`

* 打包 `pnpm run build`

## 部署

在 gitee 创建 deploy 开头的标签

## 开发说明

* 原生的 `markdown` 中无法 video 组件无法设置 `basePath` ，使用 `markdoc` 插件解决了该问题，但是需要改造 markdown 文件，参见 `src/content/docs/应用开发示例/标准操作说明/sop-develop.mdoc` 中的 `VideoPlayer` 标签
* 视频资源只能放在 `public` 文件中加载
* 可以动态读取 `src/content` 中的文件生成目录列表，参见 `src/pages/article/[...slug].astro` 文件中的 `collectDocList` 方法
* mdoc 中的图片地址需要写成 `./xxxx/xxx.png`，不能像普通的 markdown 一样直接写 `xxxx/xxx.png`
* 因为 prism 不识别 vue 类型代码块，所以 mdoc 中的代码块不要使用 vue 类型，请使用 xml 代替（后续解决了 mdoc 使用 shiki 报错的问题后可解决该问题）
* astro 要求 markdown 文件名不能包含大写字母，所以需要在页头 formatter 中定义页面 title (非必填，默认文件名) 和 sort（非必填，默认 999） 字段，title 用来显示在目录中，sort 用来在同级文件夹内排序
* 笔记左侧第一级目录是固定的，不能动态扩展，二级目录和三级目录可以根据文件动态展示，最大支持 3 级目录，在二级目录下创建 `readme.md` 文件（不区分大小写）可为二级目录创建链接，参考 `src/content/docs/应用开发示例/标准操作说明/README.md`，一级目录不支持配置链接
* markdown 文件标题从二级标题开始写，右侧本页目录显示第二级标题和第三级标题
* mdoc 的代码高亮使用 prism 实现（使用 shiki 会报一个奇怪的错误），markdown 中的代码高亮还是使用默认的 shiki 实现，使用的均为 one-light 主题
* 图片转 webp 依赖 sharp 插件，需要安装该插件