search

csepulv / electron-with-create-react-app

Sample Electron application using create-react-app
MIT License
831 stars 217 forks source link

images broken after building with electron-builder #19

Closed lduros closed 4 years ago

lduros commented 6 years ago

Hello, This may not be directly an issue with this package, but whenever I use electron-builder and build a standalone electron app (dmg file, ...) everything works great for the React piece inside Electron except for the images. I can see them both in my public directory as well as in the build/ directory. However after debugging the standalone electron app, it's attempting to load the image from 

file:///my-img-folder/my-img.png

while it should probably be something like this as a prod electron, I'm assuming:

file:///Applications/m-yapp.app/Contents/Resources/app.asar/build/my-img-folder/my-img.png

Has anyone seen this behavior as well? I'm thinking a variable in .env might be the solution here, but I'm not sure what it should be.

csepulv commented 6 years ago

I don't know how to fix this. In a quick search, I found this https://github.com/chentsulin/electron-react-boilerplate/issues/712, which describes a fix via a webpack config change. But that would require eject of the app.

I will see if i find anything else.

lduros commented 6 years ago

Thanks for looking into it, I'll update here if I can find a solution. I guess I could use hardcoded data-uris meanwhile for images. Also, it might be a possibility to eject only within the context of building the app with electron-builder.

csepulv commented 6 years ago

https://github.com/facebook/create-react-app/pull/94 and https://github.com/facebook/create-react-app/issues/165 might also help

thalessd commented 5 years ago

If your using React, Electron and react-router-dom, change your react-router-dom "BrowserRouter" to "HashRouter".

kylelynchkurzawa commented 4 years ago

@thalessd Thank you so much!! The switch from BrowserRouter to HashRouter solved my image issues too!

claytonfbell commented 4 years ago

If your using React, Electron and react-router-dom, change your react-router-dom "BrowserRouter" to "HashRouter".

This probably saved me sooo much time, thank you!

RafaelDamiani commented 4 years ago

If your using React, Electron and react-router-dom, change your react-router-dom "BrowserRouter" to "HashRouter".

Amazing man, thank u so much!