如何从 getStaticProps 返回重定向而不从 TypeScript 出错？

Question

问题

我将 Next.js 与 TypeScript 结合使用。如果数据不存在，当我尝试返回重定向时出现错误。

代码

import { GetStaticProps } from "next";
import fs from "fs/promises";
import path from "path";

function HomePage({ products }: { products: { id: string; title: string }[] }) {
  return (
    <ul>
      {products.map((product) => {
        <li key={product.id}>{product.title}</li>;
      })}
    </ul>
  );
}

export const getStaticProps: GetStaticProps = async () => {
  const filePath = path.join(process.cwd(), "data", "dummy-backend.json");
  const jsonData = await fs.readFile(filePath);
  const data = JSON.parse(jsonData.toString());

  // THE PROBLEM
  if (!data) {
    return {
      redirect: {
        destination: "/no-data",
      },
    };
  }

  if (data.products.length === 0) {
    return { notFound: true };
  }

  return { props: { products: data.products }, revalidate: 10 };
};

export default HomePage;

错误信息

输入 '() => Promise<{ 重定向: { 目的地: 字符串; }; 未找到？：未定义；道具？：未定义；重新验证？：未定义；} | { 未找到：真；重定向？：未定义；道具？：未定义；重新验证？：未定义；} | { 道具： { ...; }; 重新验证：数字；重定向？：未定义；未找到？：未定义；}>' 不可分配给类型 'GetStaticProps<{ [key: string]: any; }, ParsedUrlQuery>'.

输入 'Promise<{ 重定向：{ 目的地：字符串；}; 未找到？：未定义；道具？：未定义；重新验证？：未定义；} | { 未找到：真；重定向？：未定义；道具？：未定义；重新验证？：未定义；} | { 道具： { ...; }; 重新验证：数字；重定向？：未定义；未找到？：未定义；}>' 不可分配给类型 'Promise<GetStaticPropsResult<{ [key:string]: any; }>>'。

类型 '{ 重定向：{ 目的地：字符串；}; 未找到？：未定义；道具？：未定义；重新验证？：未定义；} | { 未找到：真；重定向？：未定义；道具？：未定义；重新验证？：未定义；} | { 道具： { ...; }; 重新验证：数字；重定向？：未定义；未找到？：未定义；}' 不可分配给类型 'GetStaticPropsResult<{ [key: string]: any; }>'。

类型 '{ 重定向：{ 目的地：字符串；}; 未找到？：未定义；道具？：未定义；重新验证？：未定义；}' 不可分配给类型 'GetStaticPropsResult<{ [key: string]: any; }>'。

类型 '{ 重定向：{ 目的地：字符串；}; 未找到？：未定义；道具？：未定义；重新验证？：未定义；}' 不可分配给类型 '{ props: { [key: string]: any; }; 重新验证？： 数量 | 布尔 | 不明确的; }'。

属性“props”的类型不兼容。

类型“undefined”不可分配给类型“{ [key: string]: any;” }'.ts(2322)

这个错误是由这段代码引起的

if (!data) {
    return {
      redirect: {
        destination: "/no-data",
      },
    };
  }

Answer 1

根据此文档，https://nextjs.org/docs/pages/api-reference/next-config-js/redirects代码应该是这样的。目的地和永久都是需要的。

if (!data) {
    return {
      redirect: {
        destination: "/",
        permanent: false,
      },
    };
  }