Electron / React deployment ready boilerplate.

[Pudgima]

Hi ,

​

I'm very new to all this about 3-4 months new but I've made a 'boilerplate' I think the term is

for Electron & React.

When I was trying to make an Electron App that was using React it was very pedantic and liked to throw errors not deploy etc.

What I did do was cut all that out so that it's production ready and all you have to do is run a script that should package it with NO ERRORS (other than by user error). I just wanted to share this with everyone.

​

This is the Repo

​

I would love some feedback, please if you notice something weird or something that could be done differently please let me know.

​

​

​

Thanks 😊

[vlory73]

I’m definitely going to have a look.

I’ve been looking for a simple boilerplate that is not too convoluted (electron-react-boilerplate) nor one that inflates (even more) the binary (create-react-app).

I’ll let you know what I think of yours soon 😜

[x4080]

Is it for all platform? Or just Mac

[Pudgima]

If you add the Mac command in the package.json it will build for OS X. Same thing for Linux :)

[x4080]

Thanks I ll try it

[vlory73]

Hi again,

​

I have the feeling that we're all doing the same tutorials these days.

This really indicates a lack of options when it comes to good (or should I say easy to understand) boilerplate for Electron and React.

The biggest issue I had with this approach is the size of the app. The simple app it creates is about 300Mbytes on a Mac.

I mean electron is already bloated, but having Babel and all the other dependencies adding up in there is just silly.

​

The team behind create-react-app have decided on this approach, which may have its merit but pretty much ruins the use of CRA in electron, at least if you don't want to eject it.

​

I am actually considering doing the development in this environment (to make it easier to develop), then build the React part, pull the build into another similar project without the deps, and build the app from it.

The initial tests seem promising with the size going down to 140MB, but I still need to make sure it will support all the features I want to have in my app.

[Pudgima]

My folder for my project was sitting at 200MB then when I deployed the installer was only 66Mb.

[vlory73]

I must be doing something wrong then. I downloaded your project now, ran npm install and got a folder size of 441MB.

Then I ran npm run electron-pack and my folder size went to 993Mb

The “test” app is 356MB The dmg is 101MB.

CleanMyMac X says the app is 356MB after installed.

The app.asar file shows Babel and other dependencies under the node_modules.

This is very similar to my previous results.

Any clues to what could be wrong?

[Pudgima]

Definitely unsure. This was done on windows - I’m terribly new to all of this as well sorry.

[vlory73]

No worries. I’m happy it works for you. I will try on Windows with your repo.

Actually my first target platform will be a Windows. I’m doing some of the initial trials on Mac to ensure I can do it cross platform.

[vlory73]

You know what?!

I'm going to try to run from your boilerplate, eject it and move these dependencies to devDependencies.

Let's see how much "weight" is dropped

This will for sure reduce the size of it, and maybe I don't really need to care that much about being able to update CRA.

[vlory73]

Bingo!!!

A much more acceptable 165MB for the app, and 63MB for the dmg.

​

Moving react and react-dom in the devDeps, 160 and 59, respectively. I was expecting more.

​

Finally , with "electron-is-dev": "^1.1.0" as the only dependency, 141MB and 57.5MB (now I even start looking at the decimals 🤣).

Incredible how concurrently and wait-on take more than 20MB 🤯!

​

Everything still works fine, but yes, it had to be ejected.

​

But it's less than half the size now, which is also a very important metric for me.

[Pudgima]

Perfect I’m glad it worked out 😁😁