I'm attempting to launch my initial Next.js
application using Vercel.
Even though the app runs smoothly on my local machine (it builds locally with yarn run build
and I can develop normally using yarn run dev
), I am encountering issues with the build/deployment process on Vercel.
Failed to compile Type error: Cannot find module '../../pages/error/ErrorPage' or its corresponding type declarations.
Here are the logs from the build that I am receiving:
https://i.sstatic.net/1dSKD.png
The contents of the related files are as follows:
app/components/async/AsyncContainer.tsx
import React from "react";
import ErrorPage from "../../pages/error/ErrorPage";
import NotFoundPage from "../../pages/not-found/NotFoundPage";
import SpinnerFullPage from "../spinners/SpinnerFullPage";
import { PageStatus } from "types";
import { useInitializing } from "app/hooks/stateHooks";
interface AsyncContainer {
status: PageStatus,
}
const AsyncContainer: React.FC<AsyncContainer> = (props) => {
const { status } = props;
const initializing = useInitializing();
const ERROR = status === "ERROR";
const LOADING = status === "LOADING";
const NOT_FOUND = status === "NOT_FOUND";
return(
LOADING || initializing ?
<SpinnerFullPage/>
: NOT_FOUND ?
<NotFoundPage/>
: ERROR ?
<ErrorPage/>
: <React.Fragment>
{props.children}
</React.Fragment>
);
};
export default AsyncContainer;
app/pages/error/ErrorPage.tsx
import React from "react";
import styled from "styled-components";
import Image from "next/image";
import RichText from "app/components/text/RichText/RichText";
import { IMAGE_URL } from "app/constants/IMAGE";
// ... A BUNCH OF STYLED COMPONENTS LIKE:
// const Container_DIV = styled.div``;
interface ErrorPageProps {}
const ErrorPage: React.FC<ErrorPageProps> = (props) => {
console.log("Rendering ErrorPage...");
return(
<Container_DIV>
<MaxWidth_DIV>
<Title_H1>
500
</Title_H1>
<Ratio_DIV>
<Image_DIV>
<Image
layout={"fill"}
objectFit={"cover"}
src={IMAGE_URL.ERROR}
/>
</Image_DIV>
</Ratio_DIV>
</MaxWidth_DIV>
</Container_DIV>
);
};
export default React.memo(ErrorPage);
What could be causing this issue?