vitepress的坑

VitePress是一款基于Vue3和Vite构建工具的静态网站生成器，它具有快速、简洁和易于使用的特点。但是，使用VitePress时也可能会遇到一些坑，下面我将结合自己的实际使用经验，为大家介绍一些VitePress的坑以及解决方法。

1. 404 页面
   在使用VitePress时，如果出现了访问页面时提示“404 Not Found”的错误，这通常是由于路由设置的问题引起的。要解决这个问题，可以检查路由配置是否正确，确保路由名称、路径和组件名称都正确。

2. 代码高亮
   VitePress内置了Prism.js作为代码高亮插件，但是有时候可能会出现代码高亮不起作用的情况。要解决这个问题，可以尝试安装和使用其他代码高亮插件，例如highlight.js或者CodeMirror。

3. 自定义主题
   VitePress的默认主题非常简洁，如果需要自定义主题，则需要了解Vue3的开发和打包机制。在自定义主题时，需要在/src/theme文件夹下创建自定义主题文件，并在/src/index.js文件中引入和配置主题。此外，自定义主题还需要打包成UMD格式的JS文件，并通过vite.config.js文件进行配置。

4. 静态资源
   在使用VitePress时，如果需要加载一些静态资源，例如图片或者字体等，需要将这些资源放到/public文件夹下，然后在markdown文件或者Vue组件中使用相对路径进行引用。注意，引用路径不应该以/开头。

5. 插件
   VitePress支持安装和使用插件，但是有些插件可能与VitePress的构建机制不兼容，导致构建失败或者运行出错。在使用插件时，需要仔细查看插件文档，了解插件的兼容性和使用方法。

6. 部署
   在使用VitePress时，如果需要部署到服务器上，可以使用vite build命令进行打包，然后将打包后的文件上传到服务器即可。注意，VitePress的打包输出路径默认为/dist，需要在服务器上将静态文件根目录设置为该路径。