0

It seems a strict CSP for style-src will be unhappy when webpack's style-loader tries to append inline CSS in a create-react-app (CRA):

enter image description here

I was wondering if I need to use a webpack dev server to take advantage of using a nonce token, or if CRA had a way of circumventing this style issue during development. The REACT_APP_INLINE_RUNTIME_CHUNK=false value doesn't seem to help in this case (in fact, I'm not seeing a difference in the resources that come over the wire between setting it to true vs. false). But I am running npm start instead of npm build, I think the latter properly builds with environmental variables, not sure about the CRA dev server.

A13X
  • 409
  • 1
  • 6
  • 27

1 Answers1

0

From what I can tell, CRA doesn't really want you overriding things. But if you must, you can use something like react-app-rewired, or eject (which is strongly advised against because it will derail package updates CRA uses to keep everything nice and neat and working).

There's also modifying the build files themselves in node_modules/react-scripts/config/webpack.config.prod.js, although what I'm currently doing is commenting-out the meta tag during development and uncommenting on submit, which is about the same amount of work I think if I have to rebuild/reinstall on updating the module anyway. Although I don't typically update it that often.

Source: https://stackoverflow.com/a/64361307/1580355

A13X
  • 409
  • 1
  • 6
  • 27