0

I have this NextJS project that im trying to deploy. But when it builds, it fails an gives me this error:

Build optimization failed: found pages without a React Component as default export in pages/portfolio/styles pages/styles

Those files are these:

import tw from "tailwind-styled-components";

export const Wrapper = tw.div`
    h-screen
    flex
    flex-col
`;

export const Main = tw.main`
`;

export const Container = tw.div`
    flex
    items-center
    justify-center
    flex-col
`;

export const Footer = tw.div`
    w-full
    flex
    items-center
    justify-center
    min-h-[50px]
    bg-black
    mt-5
`;

export const HeroSection = tw.div`
    relative
    w-full
    h-[70vh]
    lg:h-[100vh]
    bg-black
`;

export const HomeGallery = tw.div`
    grid
    grid-cols-1
    w-full
`;

export const About = tw.div`
    text-justify
    text-lg
    px-5
    py-9
`;

And

import tw from "tailwind-styled-components";

export const Container = tw.div`
  
`;

export const ImagesContainer = tw.div`
    grid
    grid-cols-1
`;

I tried using styled components instead of taiwilnd styled components and got the same problem. I remember using styles.js files with styled components on another project so I don't understand where's the problem

alburt
  • 11
  • 6
  • 2
    sounds that you shouldnt put it under pages folder maybe? – Breezer Nov 23 '22 at 23:32
  • 1
    a more throughout answer can be found here https://stackoverflow.com/questions/65598753/cant-build-react-next-project-found-page-without-a-react-component-as-default – Breezer Nov 23 '22 at 23:35
  • I got a different project using the same file management and it works... That one didn't work for me, i'm getting 404 page not found with that solution – alburt Nov 23 '22 at 23:42

1 Answers1

0

I hope this can help you. I think it's nothing major problem in your work,isn't that you are not import React yet. You can find more references about how to use styled component at Medium in link : Use Styled Component on Reactjs

  • Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Nov 27 '22 at 23:01