nuxt-module-feed
Feed 模块使每个人都能拥有 RSS、Atom 和 JSON。
功能
- Nuxt 3 就绪
- 三种不同的 Feed 类型(RSS 2.0、ATOM 1.0 和 JSON 1.0)
- 完全可定制
- 多个 Feed
- 适用于所有模式(SSR、SSG)
快速设置
- 将
nuxt-module-feed
依赖项添加到您的项目中
# Using pnpm
pnpm add -D nuxt-module-feed
# Using yarn
yarn add --dev nuxt-module-feed
# Using npm
npm install --save-dev nuxt-module-feed
- 将
nuxt-module-feed
添加到nuxt.config.ts
文件的modules
部分
export default defineNuxtConfig({
modules: ["nuxt-module-feed"],
});
就是这样!您现在可以在您的 Nuxt 应用中使用 nuxt-module-feed ✨
配置
您可以像以下方式一样在 nuxt.config.ts
中传递配置到模块
export default {
feed: {
sources: [
{
path: "/feed.xml", // The route to your feed.
type: "rss2", // Can be: rss2, atom1, json1
cacheTime: 60 * 15, // How long should the feed be cached
},
{
path: "/feed2.xml", // The route to your feed.
type: "rss2", // Can be: rss2, atom1, json1
cacheTime: 60 * 15, // How long should the feed be cached
}
...
]
},
};
Nitro 钩子
feed:generate
类型: async (ctx: { feed: Feed, options: SourceOptions }) => void | Promise<void>
此钩子允许您在 Feed 发送到客户端之前修改运行时的 Feed。
Feed 创建基于 feed 包。请将其用作参考,并进一步了解修改传递给创建函数的 Feed 对象的文档。
注意:它适用于 SSG 和预渲染页面。
import type { NitroCtx, Feed } from "nuxt-module-feed";
export default defineNitroPlugin((nitroApp) => {
nitroApp.hooks.hook("feed:generate", async ({ feed, options }: NitroCtx) => {
switch (options.path) {
case "/feed.xml": {
createTestFeed(feed);
break;
}
case "/feed2.xml": {
createTestFeed(feed);
break;
}
...
}
});
function createTestFeed(feed: Feed) {
feed.options = {
id: "Test Feed",
title: "Test Feed",
copyright: "Test company",
};
type Post = {
title: string;
url: string;
description: string;
content: string;
date: Date;
image: string;
};
const posts: Post[] = [
{
title: "Post 1",
url: "https://example.com/post-1",
description: "This is the first post",
content: "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
date: new Date("2022-01-01"),
image: "https://example.com/images/post1.jpg",
},
{
title: "Post 2",
url: "https://example.com/post-2",
description: "This is the second post",
content:
"Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",
date: new Date("2022-01-05"),
image: "https://example.com/images/post2.jpg",
},
{
title: "Post 3",
url: "https://example.com/post-3",
description: "This is the third post",
content:
"Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.",
date: new Date("2022-01-10"),
image: "https://example.com/images/post3.jpg",
},
{
title: "Post 4",
url: "https://example.com/post-4",
description: "This is the fourth post",
content:
"Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.",
date: new Date("2022-01-15"),
image: "https://example.com/images/post4.jpg",
},
{
title: "Post 5",
url: "https://example.com/post-5",
description: "This is the fifth post",
content:
"Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
date: new Date("2022-01-20"),
image: "https://example.com/images/post5.jpg",
},
];
posts.forEach((post) => {
feed.addItem({
title: post.title,
id: post.url,
link: post.url,
description: post.description,
content: post.content,
date: post.date,
});
});
feed.addCategory("Nuxt.js");
feed.addContributor({
name: "Miha Sedej",
email: "[email protected]",
link: "https://tresko.dev/",
});
}
});
这是一个 示例。
开发
# Install dependencies
pnpm install
# Generate type stubs
pnpm run dev:prepare
# Develop with the playground
pnpm run dev
# Build the playground
pnpm run dev:build
# Run ESLint
pnpm run lint
# Run Vitest
pnpm run test
pnpm run test:watch
# Release new version
pnpm run release