Nuxt项目删除所有文件新建index.vue仍显旧内容，如何创建新页面？

一、清理浏览器缓存 #

• 强制刷新页面：Windows用Ctrl+Shift+R，Mac用Cmd+Shift+R，跳过浏览器缓存加载最新资源
• 直接清空浏览器的缓存数据（可在浏览器设置的隐私/缓存选项中操作）
• 若使用了广告拦截、缓存类浏览器插件，暂时禁用后重试

二、清除Nuxt构建缓存 #

• 开发环境：删除项目根目录下的.nuxt文件夹和node_modules/.cache目录，然后重新执行：

  npm run dev
  # 或 yarn dev
  

• 生产环境：删除.nuxt、dist文件夹，重新构建并启动服务：

  npm run build && npm run start
  # 或 yarn build && yarn start
  

三、验证页面路由配置 #

• Nuxt采用文件系统路由规则，确认新的index.vue文件放在正确目录：
  • Nuxt 2/3：放在pages目录下，对应根路径/
  • Nuxt 3也可使用app.vue作为入口，但如果同时存在pages/index.vue，后者优先级更高
• 检查nuxt.config.ts/js中是否有自定义路由配置（如router、routeRules），避免覆盖了根路径的路由指向

四、重启开发服务器 #

• 完全关闭Nuxt开发进程（不要仅用热重载），重新启动服务，避免进程残留读取旧缓存
• 若使用容器部署（如Docker），需确认容器内的文件已更新，重启容器或重新构建镜像

五、排查CDN/反向代理缓存 #

• 若项目通过CDN或Nginx等反向代理部署，需清理CDN缓存，或在Nginx配置中调整静态资源缓存策略：
  • 开发环境建议禁用静态资源缓存
  • 生产环境设置合理的缓存过期时间，或添加文件哈希后缀实现缓存击穿

六、检查全局布局文件 #

• 确认layouts/default.vue（或其他全局布局）没有引用旧内容，布局文件未更新也会导致页面显示异常

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