Docusaurus本地站点About页面无法显示提示页面不存在怎么办？

以下是新手配置时最容易遗漏的基础配置问题，按顺序排查即可解决99%的同类报错：

• 检查页面文件存放路径
  Docusaurus的独立静态页面必须放在src/pages/目录下才会被自动注册为路由，放在docs目录、项目根目录、自定义组件目录都不会自动生成可访问路由。
  如果你用文件夹形式组织页面（比如新建了src/pages/about/文件夹存放相关内容），文件夹内必须存在index.js/index.jsx/index.md作为路由入口文件，否则路由无法识别。
• 检查文件名与路径大小写匹配
  Docusaurus路由匹配严格区分大小写，比如文件命名为About.md时，访问/about路径就会触发404，非特殊需求统一用全小写命名页面文件即可避免这类问题。
• 核对基础路径配置
  打开docusaurus.config.js找到baseUrl配置项：如果没有部署到站点子路径的需求，直接将值设为'/'即可；如果配置了子路径比如/mysite/，访问About页的完整路径应该是/mysite/about，直接访问/about必然报错。
  导航栏的About链接配置不要省略路径开头的斜杠，正确配置示例：

  // docusaurus.config.js 导航栏配置片段
  module.exports = {
    // 其他配置省略
    navbar: {
      items: [
        // 其他导航项省略
        {
          label: 'About',
          to: '/about', // 不要写成'about'
          position: 'left',
        },
      ],
    },
  }
  

• 排查Markdown页面格式问题
  如果你的About页是Markdown格式，文件开头必须包含合法的frontmatter字段，否则Docusaurus不会将其识别为可渲染页面，最简合法示例：

  ---
  title: 关于本站
  ---
  # About
  这里是页面正文内容
  

• 清理缓存重启服务
  调整完文件或配置后，先终止本地开发服务，删除项目根目录下的.docusaurus缓存文件夹，再重新执行npm run start（或yarn start/pnpm start）启动服务，旧缓存未更新是很多时候配置正确但依然报错的核心原因。

如果终端存在明确报错，优先看报错信息里提示的文件引用路径：如果存在错误的import导入、组件引用路径写错的问题，会直接导致页面构建失败触发404，修正对应引用路径即可。

内容的提问来源于stack exchange，提问作者annewrites