next.js 主页未显示在故事书中

Question

我正在尝试在故事书中运行我的下一个主页，因为这是我第一次这样做我正在尝试遵循教程，我创建了我的下一个应用程序并初始化了运行良好的故事书，现在我想将我的主页导入故事书中，我通过创建一个文件Home.stories.tsx并将以下代码放入其中：

import Home from "../pages/index"

// eslint-disable-next-line import/no-anonymous-default-export
export default {
    title : "Pages/Home",
    component : Home,
};

export const HomePage = () => <Home />

也为了启用图像，我将其放入我的 preview.js 文件中，代码：

import * as NextImage from "next/image"

const OriginalNextImage = NextImage.default;

Object.defineProperty(NextImage, "default", {
  configurable : true,
  value : (props) => < OriginalNextImage {...props} unoptimized />
})

export const parameters = {
  actions: { argTypesRegex: "^on[A-Z].*" },
  controls: {
    matchers: {
      color: /(background|color)$/i,
      date: /Date$/,
    },
  },
}

现在，当我运行故事书时，我得到了故事书页面，但主页不可见，因为我已在下面的 ss 中附加：

有人可以指出我遗漏或代码错误的任何内容吗？ 谢谢你。

Answer 1

我也经历过同样的事情。 尝试删除 /pages/index.tsx 中的初始内容也许来自 '@next/font/google' 的 inter 有问题