How to use downloadable assets in electron react boilerplate - reactjs

I developed app based on electron-react-boilerplate and now I want to lower package size by moving my video/audio assets to CDN to be downloaded on first run. Assets are downloaded to assets/ directory and this directory is added to extraResources. Now when I'm using import or require in react - it cant be compilled because in dev such files doesn't exists. How I should now import such downloadable assets in react?

Related

How to have a external config file in react app with vite bundler

I am learning React and don't know the correct way to create config files. I want to have an external configuration file in my React-based project with Vite bundler. As I want to change the configurations according to my wish while using the app and the configuration file should not bundle with my app.
I have created a config.js file in a public folder that didn't work.

How to check for unimported assets in React?

Is there a way to check if any assets in your src folder in your React app are not imported in any components?
To check if there are any assets in your src folder that are not imported in any components, you can use the Webpack Bundle Analyzer. This tool generates a report that shows the contents of your app's bundle, including a list of all the assets that are included.
To use the Webpack Bundle Analyzer, you can follow the instructions in this blog post: https://blog.jakoblind.no/webpack-bundle-analyzer/
Once you have installed and configured the tool, you can run it to generate a report that shows the contents of your app's bundle. You can then use this report to see if there are any assets in your src folder that are not included in the bundle, which would indicate that they are not being imported in any of your components.

How do I publish React App on free subdomain?

My React is working fine on localhost.
I created the build folder and uploaded the files in it, to the free subdomain hoster "000webhost". But my App is not working there. Which folder do I have to upload? Or do I need special hosters for react?
To host the app on 000webhost, you have to turn the React app into static HTML/CSS/JS files using a build tool and upload the built HTML/CSS/JS files onto 000webhost. Building the app depends on what tool you're using; e.g. if you're using create-react-app, you can refer to this link: https://create-react-app.dev/docs/production-build/

How to make an apk file downloadable from a react js website

I am having an apk file stored in a folder of my react js project src/asset/myapp.apk, I want to make it downloadable from my portfolio website. How can I achieve that?
Try putting your static files in public/ folder.
Then simply retrieve it by addressing "/path/to/file.apk"
When using src/ filename will be processed and changed relative to your webpack config which can vary each time you run a build which is not a good practice.
If you're using create-react-app read this documentation:
Using the Public Folder
Note: if you are using gatsby, please use static/ folder instead of public.

Bundle a React App as a single file JS with Parcel

I have a react app that opens a widget in a div. I want to bundle it using parcel, ideally as a single js file.
Currently my build command looks like this
// package.json
"build:widget": "parcel build src/index.js --no-source-maps -d docs"
which builds a folder of files. If I then include the index.css and index.js on a 3rd party/demo site, the app works. However it is missing the images as they are looked for relative to the host site's root, not the index.js files root.
Is it possible to combine the css and js into one convenient file, to help people add the embed to their sites?
Can I add images to the parcel so they are either embedded in the js or linked to the server/cdn where the index.js file is hosted?

Resources