search

electron-userland / electron-webpack

Scripts and configurations to compile Electron applications using webpack
https://webpack.electron.build/
906 stars 171 forks source link

[Question] How to load files from external folders when running dev #426

Open ogomez92 opened 3 years ago

ogomez92 commented 3 years ago

Hi folks: This is more of a question than an issue so sorry if it's the wrong channel, maybe someone else has run into this too. My application loads files from the user folder (/users/...) and that works fine when not running as dev, because as dev it loads from a webserver that electron-webpack creates. So these files are not accessible it seems. :9080/Users/uri/beat…efault/select.ogg:1 Failed to load resource: the server responded with a status of 404 (Not Found)

I'm wondering if there is a way to fix this? Otherwise I'd need to dist every time I want to test which makes the process much less optimized, no debugger etc.

Thanks.

loopmode commented 3 years ago

Hi. I have no clear solution but a couple of hints or directions to look into.

Firstly, try searching the issues here, this ... Somehow feels familiar....

Then, it might be worth using full URLs using the file: protocol.

Ah, and you say your app loads files - how does it do that? E.g. if you actually wanna load files from the filesystem, then you should use the fs module in the first place. To me it seems you're opening a new browser window and pass a file's URL or path..? In that case file: protocol might help.

Otherwise, you can go the full way and fs.readFile the contents of the file, then use the loaded string or Buffer to write it into a renderer window.

Slightly related and maybe inspirational: if you find a solution for each dev and prod, make yourself a utility function that makes the distinction. See here for how to use "static assets" ( https://webpack.electron.build/using-static-assets ) with such util function: https://github.com/loopmode/electron-webpack-static-examples/blob/master/src/renderer/utils/getStatic.ts

ogomez92 commented 3 years ago

Oh, I had not thought of static. Thanks so much for your help, I'll look into it.

On 2/8/21, Jovica Aleksic notifications@github.com wrote:

Hi. I have no clear solution but a couple of hints or directions to look into.

Firstly, try searching the issues here, this ... Somehow feels familiar....

Then, it might be worth using full URLs using the file: protocol.

Ah, and you say your app loads files - how does it do that? E.g. if you actually wanna load files from the filesystem, then you should use the fs module in the first place. To me it seems you're opening a new browser window and pass a file's URL or path..? In that case file: protocol might help.

Otherwise, you can go the full way and fs.readFile the contents of the file, then use the loaded string or Buffer to write it into a renderer window.

Slightly related and maybe inspirational: if you find a solution for each dev and prod, make yourself a utility function that makes the distinction. See here for how to use "static assets" ( https://webpack.electron.build/using-static-assets ) with such util function: https://github.com/loopmode/electron-webpack-static-examples/blob/master/src/renderer/utils/getStatic.ts

-- You are receiving this because you authored the thread. Reply to this email directly or view it on GitHub: https://github.com/electron-userland/electron-webpack/issues/426#issuecomment-774940228

loopmode commented 3 years ago

Yes but static will only be useful for files that you provide at compile-time and you wanna roll them out with the production build. It is not for user-provided files, it's for developer-provided ones.

ogomez92 commented 3 years ago

The funny thing is, if I run the rpoduction build those files laod fine. I don't have to read most of them with fs, even though the fs module is working fine. I load them directly pointing to the folder, and this works in production because Electron loads the file and with electron-webpack dev it loads the rendered stuff via localhost:port

On 2/8/21, Jovica Aleksic notifications@github.com wrote:

Yes but static will only be useful for files that you provide at compile-time and you wanna roll them out with the production build. It is not for user-provided files, it's for developer-provided ones.

-- You are receiving this because you authored the thread. Reply to this email directly or view it on GitHub: https://github.com/electron-userland/electron-webpack/issues/426#issuecomment-775056435

loopmode commented 3 years ago

How exactly are you loading? Also, what exactly is the URL or path you wanna load? Does it start with a dot? With a slash?

loopmode commented 3 years ago

Because what you describe is just fundamental behavior of this library: in development, everything is webpack dev server so you can work fast, get HMR etc. It's not a bug, it's a feature. You just need to know it and work with it. That was the point of the script i linked: an example of how to treat development and production builds differently, using different URL to access files..

ogomez92 commented 3 years ago

Nope. With a / because it's in /Users/username/... I can load files inside the electron app just fine. I am loading by pointing at the files with an external sound module called sono. I'm assuming it loads using http.

On 2/8/21, Jovica Aleksic notifications@github.com wrote:

How exactly are you loading? Also, what exactly is the URL or path you wanna load? Does it start with a dot? With a slash?

-- You are receiving this because you authored the thread. Reply to this email directly or view it on GitHub: https://github.com/electron-userland/electron-webpack/issues/426#issuecomment-775058560

shahkeyur commented 3 years ago

@ogomez92 Were you able to solve the issue?

ogomez92 commented 3 years ago

Not yet. 🙂

El 10 feb 2021, a las 19:49, Keyur Shah notifications@github.com escribió:

@ogomez92 https://github.com/ogomez92 Were you able to solve the issue?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/electron-userland/electron-webpack/issues/426#issuecomment-776930567, or unsubscribe https://github.com/notifications/unsubscribe-auth/AA4P75JLOCSQBV2GSSJFXGTS6LIKZANCNFSM4XIN7OXQ.

shahkeyur commented 3 years ago

Are you getting any error like, Could not load local resource in devtools ?

So far what I have understood is that, you have a file in user's folder that you need access to. So may be you're using app.getPath('home') to get users path, then append the location of file. Is that correct ?

On Thu., Feb. 11, 2021, 2:12 a.m. ogomez92, notifications@github.com wrote:

Not yet. 🙂

El 10 feb 2021, a las 19:49, Keyur Shah notifications@github.com escribió:

@ogomez92 https://github.com/ogomez92 Were you able to solve the issue?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub < https://github.com/electron-userland/electron-webpack/issues/426#issuecomment-776930567>, or unsubscribe < https://github.com/notifications/unsubscribe-auth/AA4P75JLOCSQBV2GSSJFXGTS6LIKZANCNFSM4XIN7OXQ .

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/electron-userland/electron-webpack/issues/426#issuecomment-777244709, or unsubscribe https://github.com/notifications/unsubscribe-auth/AIICLM6GF6ANVIMR2FBWSNDS6N7MBANCNFSM4XIN7OXQ .

loopmode commented 3 years ago

In any case, I'd you're trying to simply display a local file in the renderer, it's basically displaying a file in the browser and you should make sure to prepend file: protocol.