Which CSS strategy is busy.org using? I have some issue with SSR when I use styled-component alongside with React, the css just won't show up.
You are viewing a single comment's thread from:
Which CSS strategy is busy.org using? I have some issue with SSR when I use styled-component alongside with React, the css just won't show up.
We use .less files (due to the fact we use
<p dir="auto">If you want to use <code>styled-components on the server you have to wrap your entire application in <code>ServerStyleSheet<span> collector that would collect all of your styles from components. After it's done you can just retrieve normal style tags from it and add it to your page. Take a look here: <a href="https://www.styled-components.com/docs/advanced#server-side-rendering" target="_blank" rel="noreferrer noopener" title="This link will take you away from hive.blog" class="external_link">https://www.styled-components.com/docs/advanced#server-side-renderingantdand we have to use Less to modify it), and just use webpack import's to import them. After we build our app, we have .html files that includes all stylesheets. This file is then used as a template on the server.I had been using sass for a while. Transition to
styled-componenttook me sometime to get used to it haha.I like the way styled-jsx works. It feels like normal CSS but has some great features (scoped to current component, works on SSR).
If you are working on new app and want to have SSR I recommend checking out Next.js.
Currently I am still using Express or Koa for SSR haha.
I am also looking on this jss where Material-UI is using this.