Nuxt.js对接Netlify CMS时第二个集合生成错误访问路径问题

问题根因 #

该错误与Netlify CMS的config.yml配置无关，是前端Nuxt Content查询逻辑硬编码了blog集合路径，未根据当前访问的内容集合动态匹配查询目标，因此访问some集合内容时仍会请求blog目录下的资源。

排查修复步骤 #

• 定位项目中的文章详情路由文件，常见路径为pages/[collection]/[slug].vue、pages/blog/[slug].vue或自定义的内容详情页组件，同时检查文章列表页的链接生成逻辑，确认some集合的文章跳转链接前缀为/some/而非/blog/，避免路由跳转时就进入错误的路径分支。
• 找到调用queryContent()的查询代码，通常存在硬编码blog路径的错误写法，示例如下：

// 错误写法：固定查询blog目录内容
const { data: post } = await useAsyncData('post', () => {
  return queryContent('/blog/' + route.params.slug).findOne()
})

• 根据路由结构修改查询逻辑：
  • 如果使用集合名作为动态路由参数，直接从路由中读取集合名拼接查询路径：

  const route = useRoute()
  const { data: post } = await useAsyncData('post', () => {
    return queryContent(`/${route.params.collection}/${route.params.slug}`).findOne()
  })
  

  • 如果为some集合单独创建了路由页面（如pages/some/[slug].vue），直接将查询路径中的/blog替换为/some即可
• 修复后删除项目根目录下的.nuxt缓存文件夹，重启Nuxt开发服务，避免旧缓存导致配置不生效。

验证标准 #

访问some集合下的文章时，开发者工具中Nuxt Content的资源请求路径应为http://localhost:3000/_content/some/[文章slug]，页面可正常渲染内容即为修复完成。

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