Nuxt3中@nuxtjs/sitemap模块无法生成动态路由多站点地图
排查与解决方案
1. 修复nuxt.config.ts中的请求方式
在Nuxt配置文件的顶层直接调用axios.get可能存在环境注入问题,建议改用node-fetch或Nuxt内置的$fetch替代:
// 先安装node-fetch:npm install node-fetch import fetch from 'node-fetch' export default defineNuxtConfig({ modules: ['@nuxtjs/sitemap'], sitemap: [ { path: '/pages-sitemap.xml', hostname: 'https://nuxt3-website.nl', cacheTime: 1000 * 60 * 15, gzip: true, routes: async () => { const res = await fetch('https://wordpress-site.nl/wp-json/wp/v2/pages'); const data = await res.json(); return data.map(page => `/${page.slug}`); } }, { path: '/posts-sitemap.xml', hostname: 'https://nuxt3-website.nl', cacheTime: 1000 * 60 * 15, gzip: true, routes: async () => { const res = await fetch('https://wordpress-site.nl/wp-json/wp/v2/posts'); const data = await res.json(); return data.map(post => `/blog/${post.slug}`); } } ] });
2. 统一站点域名配置
你当前的两个站点地图配置使用了不同的hostname,这会导致生成逻辑冲突。需确保所有站点地图绑定到当前Nuxt项目的实际域名。
3. 验证路由生成结果
在routes函数中添加日志,确认返回的路由格式是否符合预期:
routes: async () => { const res = await fetch('https://wordpress-site.nl/wp-json/wp/v2/pages'); const data = await res.json(); const routes = data.map(page => `/${page.slug}`); console.log('生成的页面路由:', routes); // 查看终端输出 return routes; }
启动服务器后检查终端日志,若路由为空或格式错误,需确认WordPress API返回的slug字段是否存在。
4. 检查模块版本兼容性
确保@nuxtjs/sitemap版本与Nuxt 3兼容,安装最新稳定版:
npm install @nuxtjs/sitemap@latest
同时确认模块文档中多站点地图的数组配置格式是否被当前版本支持。
5. 清理缓存并重启
- 删除
.nuxt目录和node_modules/.cache文件夹 - 执行
npm run dev重启服务器 - 访问站点地图时强制刷新浏览器(Ctrl+F5),避免缓存旧的404响应
6. 排查路由冲突
确认Nuxt项目中没有定义与/pages-sitemap.xml、/posts-sitemap.xml同名的页面或自定义路由,防止路由被覆盖。
内容的提问来源于stack exchange,提问作者Max
相关产品推荐
相关产品推荐

