How to Install Electron on a clean OSX instance and enable the creation of editable projects

Prerequisites

Chocolatey

Despite the heeeeasssyy and siiiimmmple instructions for node/npm claiming that chocolatey is required, chocolatey is NOT required as a prerequisite on OSX.

NVM

Node Version Manager is highly recommended as a prerequisite as it makes managing node/npm versions easy.

To install, the basic instructions are found at nvm's home, found here.

It is highly probably that you will get errors, and that you will need sudo to prevent further errors. You'll just have to work through them to get node/npm running, as the errors are OSX image specific.

Installation

Once Node and NPM are running correctly, you can begin installing Electron:

1. The Electron home page is here. The Electron Forge home page is here.
2. The command to install a basic Electron app is:
   

   npm init electron-app@latest [appName]

   
   it is recommended to create a Projects folder somewhere on your OSX instance, where your electron apps will reside.
   
   The FIRST time you create an electron app, you will need sudo or you will get errors. Also, apps created with sudo are not editable without sudo or root. Of course, this is not mentioned in the heeeasssy and siiiimmple instructions found on the Electron Forge home page.
3. Once you have created your first electron app with sudo, delete it, as it is not editable. However, other files and directories that electron requires will get installed with the proper permissions.
4. From here on, you can use the command above to create editable electron projects. In the app's directory, point your favorite HTML IDE to the src folder, and open the index.html file present there. If when creating a new project at this point, you get NPM errors or permissions errors, just get_info into the app's directory as an admin, and set everything to read/write, recursively. You STILL may have to delete and reenter before the app will work properly, especially with webpack-enabled apps.
5. The command to install a webpack-enabled app is:
   

   npm init electron-app@latest [appName] -- --template=webpack

   
   
6. The command to start an Electron app is, and you HAVE to be in the app's directory to do it:

   npm start

   
   
7. Note that once an Electron app runs successfully, just leave it open while editing and it MAY hot reload automatically. It's flaky. If it doesn't, just choose View -> Force Reload on Electron's main menu.