vue项目开发中,如何生成sitemap.xml
文件,下面编程教程网小编给大家简单介绍一下!
在router.js路由中新增以下代码:
function getRoutesList(routes, pre) {
return routes.reduce((array, route) => {
const path = `${pre}${route.path}`;
if (route.path !== '*') {
array.push(path);
}
if (route.children) {
array.push(...getRoutesList(route.children, `${path}/`));
}
return array;
}, []);
}
//生成sitemap
function getRoutesXML() {
const list = getRoutesList(router.options.routes, 'https://ipkd.cn/')
.map(route => `<url><loc>${route}</loc></url>`)
.join('\r\n');
return `<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd">
${list}
</urlset>`;
}
console.log('输出sitemap:', getRoutesXML())
以上是编程学习网小编为您介绍的“vue项目中如何生成sitemap.xml文件”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
沃梦达教程
本文标题为:vue项目中如何生成sitemap.xml文件
基础教程推荐
猜你喜欢
- 使用分层画布来优化HTML5渲染的教程 2024-04-08
- CSS3中的元素过渡属性transition示例详解 2024-01-19
- JS实现轮播图小案例 2023-08-08
- vue主页点击按钮如何调用子组件方法 2024-12-10
- css实现元素垂直居中显示的7种方式 2024-01-24
- vue项目创建步骤及路由router 2024-04-15
- 在 React 中使用 Redux 解决的问题小结 2024-04-09
- 从URL中提取参数与将对象转换为URL查询参数的实现代码 2024-02-10
- vuejs数字动态滚动效果封装 2024-12-09
- CSS3 实现弹跳的小球动画 2023-12-21