Skip to content

Conversation

rileytb
Copy link

@rileytb rileytb commented Jan 31, 2025

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 of MiniCssExtractPlugin 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 the architectural decisions of hf-inj-react)

This also introduces REACT_APP_INJECT_SCRIPTS which gets the entrypoints and makes them available in a given file.

@rileytb rileytb marked this pull request as ready for review January 31, 2025 22:14
@rileytb rileytb marked this pull request as draft February 26, 2025 16:10
@rileytb rileytb marked this pull request as ready for review February 26, 2025 23:36
rileytb and others added 7 commits February 27, 2025 10:17
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>
@rileytb rileytb requested a review from redbugz February 28, 2025 20:30
@redbugz
Copy link

redbugz commented Feb 28, 2025

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)),
Copy link
Author

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.publicUrlOrPathso it doesn't even need passed in

@rileytb
Copy link
Author

rileytb commented Feb 28, 2025

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?

You're correct. They aren't used that way, I have changed both of those names.

@redbugz redbugz merged commit 333447c into frontierMaster Mar 11, 2025
2 checks passed
@redbugz redbugz deleted the rileytb/EOLBFRST-921_hf-inj-react-webpack-setup branch March 11, 2025 15:46
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants