Feed module - Everyone deserves RSS, Atom and Json
Feed module enables everyone to have RSS, Atom and Json.
📖 Release Notes
Features
- Three different feed types (RSS 2.0, ATOM 1.0 and JSON 1.0)
- As many feeds as you like!
- Completely customizable. Need to fetch data before? No problem!
- Works with all modes (yes, even generate!)
- For Nuxt 2.x and higher
Setup
- Add
@nuxtjs/feed
dependency to your project
yarn add @nuxtjs/feed
- Add
@nuxtjs/feed
to the modules
section of nuxt.config.js
export default {
modules: [
['@nuxtjs/feed', {
}]
]
}
Using top level options
export default {
modules: [
'@nuxtjs/feed'
],
feed: [
]
}
Configuration
So... how to get these feeds working now?
Configuration object overview
export default {
feed: [
{
path: '/feed.xml',
async create(feed) {},
cacheTime: 1000 * 60 * 15,
type: 'rss2',
data: ['Some additional data']
}
]
}
Feed create function
Let's take a closer look on the create
function. This is the API that
actually modifies your upcoming feed.
A simple create function could look like this:
import axios from 'axios'
async create (feed) {
feed.options = {
title: 'My blog',
link: 'https://lichter.io/feed.xml',
description: 'This is my personal feed!'
}
const posts = await (axios.get('https://blog-api.lichter.io/posts')).data
posts.forEach(post => {
feed.addItem({
title: post.title,
id: post.url,
link: post.url,
description: post.description,
content: post.content
})
})
feed.addCategory('Nuxt.js')
feed.addContributor({
name: 'Alexander Lichter',
email: 'example@lichter.io',
link: 'https://lichter.io/'
})
}
Feed creation is based on the feed package.
Please use it as reference and further documentation for modifying the feed
object
that is passed to the create
function.
Using the create
function gives you almost unlimited possibilities to customize your feed!
Using a feed factory function
There is one more thing. Imagine you want to add a feed per blog category, but you don't want
to add every category by hand.
You can use a factory function
to solve that problem. Instead of a hardcoded array, you can setup
a function that will be called up on feed generation. The function must return an array with all
feeds you want to generate.
export default {
feed: async () => {
const posts = (await axios.get('https://blog-api.lichter.io/posts')).data
const tags = (await axios.get('https://blog-api.lichter.io/tags')).data
return tags.map(t => {
const relevantPosts = posts.filter()
return {
path: `/${t.slug}.xml`,
async create(feed) {
feed.options = {
title: `${t.name} - My blog`,
link: `https://blog.lichter.io/${t.slug}.xml`,
description: `All posts related to ${t.name} of my blog`
}
relevantPosts.forEach(post => {
feed.addItem({
title: post.title,
id: post.id,
link: `https://blog.lichter.io/posts/${post.slug}`,
description: post.excerpt,
content: post.text
})
})
},
cacheTime: 1000 * 60 * 15,
type: 'rss2'
}
})
}
}
In case you want to pass in data into the factory function, you can use a factory object.
export default {
feed: {
data: ['Your data here'],
factory: (dataFromFeedDotData) => {}
}
}
Development
- Clone this repository
- Install dependencies using
yarn install
or npm install
- Start development server using
npm run dev
License
MIT License
Copyright (c) - Nuxt Community