Stuck on an issue?
Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
Global style component was composed and rendered multiple times
See original GitHub issueWhen i add <React.StrictMode> i get an warning:
styled-components.browser.esm.js:2310 The global style component sc-global-2008140138 was composed and rendered multiple times in your React component tree. Only the last-rendered copy will have its styles remain in <head> (or your StyleSheetManager target.)
Can someone explain what is problem is, because i have no more global styles anywhere.
"dependencies": {
"cookie-parser": "^1.4.3",
"express": "^4.16.3",
"node-fetch": "^2.2.0",
"pg": "^7.4.3"
},
"devDependencies": {
"@babel/cli": "^7.0.0",
"@babel/core": "^7.0.0",
"@babel/plugin-transform-runtime": "^7.1.0",
"@babel/preset-env": "^7.0.0",
"@babel/preset-react": "^7.0.0",
"@babel/runtime": "^7.0.0",
"babel-loader": "^8.0.2",
"babel-plugin-styled-components": "^1.8.0",
"babel-plugin-transform-class-properties": "^6.24.1",
"react": "^16.5.2",
"react-cookie": "^3.0.4",
"react-dom": "^16.5.1",
"react-router": "^4.4.0-beta.0",
"react-router-dom": "^4.4.0-beta.4",
"styled-components": "^4.0.2",
"webpack": "^4.17.2",
"webpack-cli": "^3.1.0"
}
Issue Analytics
- State:
- Created 5 years ago
- Comments:16 (6 by maintainers)
Top Results From Across the Web
What happens if I render createGlobalStyle component ...
It will clear before every render. The styling is only applied as long as the component is inside the DOM. You can try...
Read more >Advanced Usage - styled-components
The basic idea is that everytime you render your app on the server, you can create a ServerStyleSheet and add a provider to...
Read more >How To Use Styled-Components In React - Smashing Magazine
Here, StyledButton is the styled component, and it will be rendered as an HTML button with the contained styles. styled is an internal...
Read more >Styling Components - Cypress Documentation
Many applications have some amount of one-time setup that is run outside of the component file. We build our applications within the context...
Read more >Rendering a list of Vue components - Learn web development
Vue components are written as a combination of JavaScript objects that ... through an array of data and render it in multiple components....
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
If it is just to get rid of the warning, then
suppressMultiMountWarningdoes the trick, like:Uhhhh… that’s awkward.