Add RSS Feed To Nuxt3 App

In this tutorial, we’re going to create an RSS feed to use with Nuxt3 and Nuxt/Content module.

First we’re going to install the RSS package into our application.

yarn add --dev rss

In Nuxt3 there is a feature to create Server Routes we’re going to use this to create our RSS feed route.

Create a new file in server/routes/feed/rss.xml.ts

In this file, we need to fetch the latest articles and output them in RSS feed format.

import { serverQueryContent } from '#content/server'
import RSS from 'rss'
export default defineEventHandler(async (event) => {
    const docs = await serverQueryContent(event).sort({ createdAt: -1 }).limit(100).find()
    const blogPosts = docs.filter((doc) => doc?._path?.includes('/articles'))
    const feed = new RSS({
        title: 'Paulund',
        site_url: 'https://paulund.co.uk',
        feed_url: `https://paulund.co.uk/feed/rss.xml`,
    })
    for (const doc of blogPosts) {
        feed.item({
            title: doc.title ?? '-',
            url: `https://paulund.co.uk${doc._path}`,
            guid: `https://paulund.co.uk${doc._path}`,
            date: doc.createdAt,
            description: doc.description,
        })
    }
    const feedString = feed.xml({ indent: true })
    event.res.setHeader('content-type', 'text/xml')
    event.res.end(feedString)
})

Originally published at https://paulund.co.uk.