Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The dynamic import here makes the CSS get dynamically loaded at runtime, resulting in a Flash Of Unstyled Content (FOUC).
It also doesn't explain why
import './index.scss';
doesn't work given that's how all MFEs and other example apps in our JS library repos import it without an issue, e.g.frontend-component-footer
(source).There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I have looked into this issue and was not able to figure out why
import './index.scss';
is not working. Webpack config and version all the things are exactly similar to the ones used inheader/footer
.However while doing RnD on this issue, I found this comment in
webpack.dev.config
that"We don't care about FOUC in development"
. As this dynamic import is being used in the example app, in my opinion we can ignore this issue for now. What do you suggest?