kriasoft/isomorphic-style-loader

How do get moduleId in server side rendering?

happylindz opened this issue · 6 comments

In the rendering of the server, I want to get the moduleId and then splicing out the id attribute of multiple styles, so that when the client renders, it can determine whether to insert css by judging the existence of the id, then I have not found the corresponding in the source code. Way to get about style moduleId

import style from './example.css'
const styles = style._getContent()
const [moduleId, css, media, sourceMap] = styles[0]
console.log(moduleId)

Thanks, another question is that could mini-css-extract-plugin extract css from js file when I use isomorphic-style-loader?

I found that both inline css and js file contain the same styles(Critical CSS), is that a way to remove critical css from js file.

With isomorphic-style-loader the idea was to always include css into js files but render into dom only critical css and also make this solution universal (works the same on client and server side).

If you want to extract css into separate files you probably need to find another way how to generate critical css rather than use isomorphic-style-loader.

Ok, i got your point. Thank you so much!

const [moduleId, css, media, sourceMap] = styles[0]
This ID is different from that generated by the client, so duplicate styles will be inserted