Closed linkenneth closed 6 years ago
@linkenneth sound like you may have a webpack issue since that check shouldn't break anything. Check out this SO answer that may apply. I'm guessing you have target: 'node'
for your client bundle?
Thanks! That seems to be the culprit. I'll close this since this isn't an actual issue anymore.
This is not very convenient since it assumes the use of webpack. For example. If I'm using React with Rollup through Vite there's no way to avoid this issue, thus making your component non-technology-agnostic.
I'm running into the same issue. I agree with what @obadakhalili said.
I'm using ViteJS (not Webpack) and I was able to get this working, with the related security considerations by adding the following to my index.html
in the <head>
tag:
<script>window.global = window;</script>
To ensure it passes the Content-Security-Policy
I used the hashed value of that new code, and added it to my policy like so:
<meta http-equiv="Content-Security-Policy" content="script-src 'sha256-pQY0fuQAnnVQH5nQfjo80rzGkQzeN3JeAtAJ+1KcD4k=' 'self' blob:">
Hope this helps others trying to get this working outside of Webpack.
@davidwinter How can i get the hashed value of my code?
@davidwinter How can i get the hashed value of my code?
echo -n 'window.global = window;' | openssl sha256 -binary | openssl base64
This will give you:
pQY0fuQAnnVQH5nQfjo80rzGkQzeN3JeAtAJ+1KcD4k=
@davidwinter thanks David it worked for me.
First of all, thanks for taking over maintenance of react-codemirror.
I'm unsure if this is an issue with my setup, but it appears that a relatively recent change to support server-side rendering now breaks client-side rendering.
global
is not defined in browsers, so line 14 here breaks:https://github.com/scniro/react-codemirror2/commit/24700c903cdb5f711ab3e949f92c7828081eff64#diff-168726dbe96b3ce427e7fedce31bb0bcR15
Could you please take a look? Looks to be a quick fix to check existence of global if this is not server-rendered.