@@ -13,10 +13,11 @@ If you're using more than one CSS-in-JS library in your project, we've got you c
1313
1414### [ Styled Components] ( https://github.com/styled-components/styled-components )
1515
16- Expose styled-components as ` global.Styled ` :
16+ Expose styled-components in your server bundle :
1717
1818``` js
19- require (' expose-loader?Styled!styled-components' );
19+ import { ServerStyleSheet } from ' styled-components' ;
20+ global .Styled = { ServerStyleSheet };
2021```
2122
2223Add the render helper to the call to ` Html.React ` :
@@ -90,10 +91,11 @@ export function StyledComponentsDemo() {
9091
9192### [ React-JSS] ( https://github.com/cssinjs/react-jss )
9293
93- Expose react-jss as ` global.ReactJss ` :
94+ Expose react-jss in your server bundle :
9495
9596``` js
96- require (' expose-loader?ReactJss!react-jss' );
97+ import { JssProvider , SheetsRegistry } from ' react-jss' ;
98+ global .ReactJss = { JssProvider, SheetsRegistry };
9799```
98100
99101Add the render helper to the call to ` Html.React ` :
@@ -179,10 +181,11 @@ export class ReactJssDemo extends React.Component {
179181
180182Emotion's integration with ReactJS.NET only supports rendering inline styles (instead of rendering them in the document head).
181183
182- Expose emotion as ` global.EmotionServer ` :
184+ Expose emotion in your server bundle :
183185
184186``` js
185- require (' expose-loader?EmotionServer!emotion-server' );
187+ import { renderStylesToString } from ' emotion-server' ;
188+ global .EmotionServer = { renderStylesToString };
186189```
187190
188191Add the render helper to the call to ` Html.React ` :
0 commit comments