-
Notifications
You must be signed in to change notification settings - Fork 1
Add REACT_APP_INJECT_STYLES to allow injecting generated styles into window variable #380
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add REACT_APP_INJECT_STYLES to allow injecting generated styles into window variable #380
Conversation
Co-authored-by: Joey Cozza <joeycozza@gmail.com>
Co-authored-by: Joey Cozza <joeycozza@gmail.com>
Co-authored-by: Joey Cozza <joeycozza@gmail.com>
Co-authored-by: Joey Cozza <joeycozza@gmail.com>
Co-authored-by: Joey Cozza <joeycozza@gmail.com>
Normally env vars prefixed with REACT_APP are called that so they get forwarded to the client. I'm not seeing any usages of that env var in the client, so do we need it to start with REACT_APP? |
|
||
fs.writeFileSync(outputPath, | ||
JSON.stringify( | ||
manifest.entrypoints.map((entry) => this.options.outputPath + entry)), |
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 entrypoints didn't have a full path (prepended w/the CDN when doing a prod build) So I needed to do this to know where to look for them. However, I am going to change this variable name because it's confusing with line 15. And it's just paths.publicUrlOrPath
so it doesn't even need passed in
You're correct. They aren't used that way, I have changed both of those names. |
This change allows REACT_APP_INJECT_STYLES to control injecting styles into a window variable (which is then used within hf-inj-react to inject them into the shadow DOM for the zion header/footer)
The use of
style-loader
for prod builds when REACT_APP_INJECT_STYLES is enabled - instead ofMiniCssExtractPlugin
is because of the warning under this section: https://webpack.js.org/plugins/mini-css-extract-plugin/#insert that this functionality is not for initial chunks. (also documented in thearchitectural decisions
of hf-inj-react)This also introduces REACT_APP_INJECT_SCRIPTS which gets the entrypoints and makes them available in a given file.