Nuxt 3中Markdown内容文件热更新及刷新失效问题求助

问题描述 #

• 通过Nuxt Studio空模板创建Nuxt 3项目并克隆到本地，执行npm run dev启动服务器后可正常加载content/index.md对应的首页
• 修改content/index.md、about.md等Markdown文件时，HMR（热模块替换）不自动刷新内容，手动刷新页面也无变化，必须完全重启Nuxt服务器后才能看到更新
• 已禁用浏览器开发者工具缓存、更换浏览器测试，确认是服务器端缓存旧内容导致问题；甚至重启服务器后编辑about.md，首次加载仍显示修改前内容

项目结构 #

project/
  content/
    about.md
    index.md
  nuxt.config.ts
  package.json

配置文件内容 #

nuxt.config.ts #

export default defineNuxtConfig({
  devtools: { enabled: true },
  modules: ['@nuxt/content'],

  routeRules: {
    '/': { prerender: true }
  },

  compatibilityDate: '2024-10-21'
})

package.json 依赖 #

{
  "dependencies": {
    "@nuxt/content": "^2.13.4",
    "nuxt": "^3.13.2"
  }
}

解决方法 #

1. 移除开发环境的预渲染配置 #

routeRules中对/设置的prerender: true会在开发模式下预渲染并缓存静态页面，导致修改无法实时生效。修改配置，仅在生产环境启用预渲染：

export default defineNuxtConfig({
  devtools: { enabled: true },
  modules: ['@nuxt/content'],

  routeRules: process.env.NODE_ENV === 'production' ? {
    '/': { prerender: true }
  } : {},

  compatibilityDate: '2024-10-21'
})

2. 禁用@nuxt/content开发环境缓存 #

在nuxt.config.ts中添加content模块的缓存配置，强制关闭开发环境下的内容缓存：

export default defineNuxtConfig({
  devtools: { enabled: true },
  modules: ['@nuxt/content'],

  content: {
    cache: {
      enabled: false
    }
  },

  routeRules: process.env.NODE_ENV === 'production' ? {
    '/': { prerender: true }
  } : {},

  compatibilityDate: '2024-10-21'
})

3. 手动清除Nuxt缓存目录 #

若配置修改后问题仍存在，手动删除缓存文件后重启服务：

• 删除项目根目录下的.nuxt文件夹
• 删除.output文件夹（如有）
• 重新执行npm run dev

4. 升级依赖到兼容版本 #

当前@nuxt/content与nuxt版本可能存在兼容性问题，执行命令升级到最新兼容版本：

npm update nuxt @nuxt/content

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