I am using electron with react and as packager electron-builder, all on the latest version.
When using require.context() in my development build its works just like intended, but when building the app it throws Cannot find module "undefined", is this because webpack is not packaging with the build? Another way of importing all images in a folder on runtime would also help if this seems unfixable.
the code throwing the error:
function importAll(r) {
let images = {};
r.keys().forEach((item, index) => { images[item.replace('./', '')] = r(item); });
return images;
}
try {
Banners = importAll(require.context('../../../Assets/Banners', false, /\.(jpg)$/));
Headers = importAll(require.context('../../../Assets/Headers', false, /\.(jpg)$/));
} catch (err) { console.error(`A problem has occurred while loading library images:\n${err.stack}`) }
I am packaging the app with this config:
"build": {
"appId": "666",
"win": {
"target": "nsis",
"icon": "public/icon.ico"
},
"files": [
"**/*"
],
"extraFiles": [
{
"from": "src/Assets",
"to": "Assets",
"filter": [
"**/*"
]
}
]
}
the file tree looks like this:
root
├───Assets
│ ├───Banners
│ │ └───image1.jpg
│ └───Headers
│ └───image1.jpg
├───Locales
├───Resources
│ └───app.asar
└───Launcher.exe