Nuxt Nation 大会即将到来。加入我们,时间为 11 月 12 日至 13 日。

nuxt-module-feed

Feed 模块使每个人都能拥有 RSS、Atom 和 JSON。

nuxt-module-feed

npm versionnpm downloadsLicenseNuxt

Feed 模块使每个人都能拥有 RSS、Atom 和 JSON。

功能

  • Nuxt 3 就绪
  • 三种不同的 Feed 类型(RSS 2.0、ATOM 1.0 和 JSON 1.0)
  • 完全可定制
  • 多个 Feed
  • 适用于所有模式(SSR、SSG)

快速设置

  1. 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
  1. 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