Skip to content

Razzle with styled components and react-toastify #1782

@RicardoGaefke

Description

@RicardoGaefke

❓Question

Hey guys, I'm facing a problem using styled components and react-toastify. My theme tsx has:

import { ToastContainer } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';

The output of this imported css is: <link data-chunk="client" rel="preload" as="style" href="/public/static/css/client.8df04b7c.css"> and react-toastify toasts don't have the styles applied. If I copy the content of ReactToastify.css into the styles tag in browser inspector it works perfectly. Something important is the css file is loaded in Network browser inspector. There is just a warn:

The resource {url} was preloaded using link preload but not used within a few seconds from...

In my old apps (which don't use razzle) the ReactToastify.css styles are within the <styles data-styled ...> tag.

Do you have a clue about how to solve this?

Thanks a lot.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions