IntecionSoftware/ipal-kit
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added styling for sitemap generator

Browse Source
This commit is contained in:
radoslaw.smolinski
2026-09-28 14:47:13 +02:00
parent e2a703fc72
commit e7f06548fb
5 changed files with 259 additions and 172 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dist/modules/seo/buildSitemapXml.js
Vendored
+20 -20
View File
@@ -1,13 +1,13 @@
/**
* Serializes sitemap entries to a clean, indented XML STRING — valid for crawlers
* and readable in the browser as the native XML tree (indented, collapsible,
* syntax-highlighted by the browser itself).
* and (with `cssUrl`) styled in the browser via plain CSS.
*
* NO XSLT stylesheet: browsers (Chrome et al.) are REMOVING XSLT support, so a
* <?xml-stylesheet?> approach is a dead end — it shows a deprecation warning now
* and will break soon. Instead we serve plain XML with the correct Content-Type;
* the browser renders its built-in formatted XML view (the "code tree" look) with
* no transformation needed.
* Two viewing modes:
* - No cssUrl → the browser's native formatted XML tree (indented, collapsible).
* - With cssUrl → a `<?xml-stylesheet type="text/css">` directive; the project's
* CSS styles the XML tags (cards, labels via ::before). NOT XSLT — that's being
* removed from browsers and shows a deprecation warning. CSS is safe and
* W3C-standard.
*
* // app/sitemap.xml/route.ts
* import { buildSitemapXml } from '@intecion/ipal-kit'
@@ -15,18 +15,21 @@
* export const dynamic = 'force-dynamic'
* export async function GET() {
* const entries = await sitemap()
* const xml = buildSitemapXml(entries)
* const xml = buildSitemapXml(entries, { cssUrl: '/sitemap.css' })
* return new Response(xml, {
* headers: { 'Content-Type': 'application/xml; charset=utf-8' },
* })
* }
*
* The indentation makes the raw XML pleasant to read; the browser's default XML
* viewer adds the tree/fold UI. Crawlers read the XML as usual.
* Put sitemap.css in the project's /public and style the tags (see docs/seo.md
* for a starter). Note: <loc> is an XML tag, not <a href> — CSS can't make it a
* clickable link (some browsers auto-detect URLs); the win is readability, not
* clickability.
*
* NOTE: if you use this custom route, DON'T also keep app/sitemap.ts — pick one
* (this route OR the Next MetadataRoute). Two sitemaps confuse crawlers.
*/ export function buildSitemapXml(entries) {
* NOTE: if you use this custom route, DON'T also keep app/sitemap.ts — pick one.
* Two sitemaps confuse crawlers.
*/ export function buildSitemapXml(entries, opts = {}) {
const { cssUrl } = opts;
const esc = (s)=>s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&apos;');
const urls = entries.map((e)=>{
const parts = [
@@ -36,12 +39,8 @@
const iso = e.lastModified instanceof Date ? e.lastModified.toISOString() : String(e.lastModified);
parts.push(` <lastmod>${esc(iso)}</lastmod>`);
}
if (e.changeFrequency) {
parts.push(` <changefreq>${e.changeFrequency}</changefreq>`);
}
if (typeof e.priority === 'number') {
parts.push(` <priority>${e.priority}</priority>`);
}
if (e.changeFrequency) parts.push(` <changefreq>${e.changeFrequency}</changefreq>`);
if (typeof e.priority === 'number') parts.push(` <priority>${e.priority}</priority>`);
const alternates = e.alternates?.languages;
if (alternates) {
for (const [lang, href] of Object.entries(alternates)){
@@ -52,7 +51,8 @@
}
return ` <url>\n${parts.join('\n')}\n </url>`;
}).join('\n');
return `<?xml version="1.0" encoding="UTF-8"?>\n` + `<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" ` + `xmlns:xhtml="http://www.w3.org/1999/xhtml">\n` + urls + `\n</urlset>`;
const stylesheet = cssUrl ? `<?xml-stylesheet type="text/css" href="${esc(cssUrl)}"?>\n` : '';
return `<?xml version="1.0" encoding="UTF-8"?>\n` + stylesheet + `<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" ` + `xmlns:xhtml="http://www.w3.org/1999/xhtml">\n` + urls + `\n</urlset>`;
}
//# sourceMappingURL=buildSitemapXml.js.map