How to compile styled-components on Next.js

if you are getting problem losing all the style from page, in the moment you render the application.

You just keep next.config.js file as the exemple, adding the code:

  compiler: {
    styledComponents: true,
  },

if you dont have this file on the projet, create it as the exemple.

Add this code:

const nextConfig = {
  reactStrictMode: true,
  swcMinify: true,
  compiler: {
    styledComponents: true,
  },
}

module.exports = nextConfig