Question

当我在本地计算机上运行npm run build和npm start时，它将完美部署到localhost，但是当我尝试将完全相同的代码部署到Vercel时，出现以下错误：

08:28:16    Failed to compile.
08:28:16    ./pages/index.tsx:5:20
08:28:16    Type error: Cannot find module '../components/layout' or its corresponding type declarations.

这绝对似乎是Layout组件的问题，我切换了重要组件的顺序，并且在尝试加载Layout组件时总是失败。这是该组件的代码：

import Alert from "./alert";
import Footer from "./footer";
import Meta from "./meta";

type Props = {
  preview?: boolean;
  children: React.ReactNode;
};

const Layout = ({ preview, children }: Props) => {
  return (
    <>
      <Meta />
      <div className="min-h-screen">
        <Alert preview={preview} />
        <main>{children}</main>
      </div>
      <Footer />
    </>
  );
};

export default Layout;

index.tsx第5行看起来像import Layout from "../components/layout";，并且我已经确认这是布局组件的正确路径。

Answer 1

确定文件名是layout.tsx而不是Layout.tsx：-）

Answer 2

我也经历过同样的事情。将 layout.tsx 修复为 Layout.tsx 文件名和组件名必须相同。

为什么Vercel无法构建我的Next.js tsx应用程序？

2 个答案: