Introduction

Bootstrap and package your project with Angular 9 and Electron 8 (Typescript + SASS + Hot Reload) for creating Desktop applications.

Currently runs with:

Angular v9.1.4
Electron v8.2.5
Electron Builder v22.6.0

With this sample, you can :

Run your app in a local development environment with Electron & Hot reload
Run your app in a production environment
Package your app into an executable file for Linux, Windows & Mac

/!\ Hot reload only pertains to the renderer process. The main electron process is not able to be hot reloaded, only restarted.

/!\ Angular 9.x CLI needs Node 10.13 or later to works correctly.

Getting Started

Clone this repository locally :

git clone https://github.com/alexs509/fs-explorer.git

Install dependencies with npm :

npm install

There is an issue with yarn and node_modules when the application is built by the packager. Please use npm as dependencies manager.

If you want to generate Angular components with Angular-cli , you MUST install @angular/cli in npm global context. Please follow Angular-cli documentation if you had installed a previous version of angular-cli.

npm install -g @angular/cli

To build for development

in a terminal window

npm start

The application code is managed by main.ts. In this sample, the app runs with a simple Angular App (http://localhost:4200) and an Electron window. The Angular component contains an example of Electron and NodeJS native lib import. You can disable "Developer Tools" by commenting win.webContents.openDevTools(); in main.ts.

The build and create an executable file with windows OS (--platform value : win32/darwin/linux)

in a terminal window

electron-packager . --platform=win32 --overwrite --icon=src/assets/icons/home.ico

Included Commands

Command	Description
`npm run ng:serve:web`	Execute the app in the browser
`npm run build`	Build the app. Your built files are in the /dist folder.
`npm run build:prod`	Build the app with Angular aot. Your built files are in the /dist folder.
`npm run electron:local`	Builds your application and start electron
`npm run electron:linux`	Builds your application and creates an app consumable on linux system
`npm run electron:windows`	On a Windows OS, builds your application and creates an app consumable in windows 32/64 bit systems
`npm run electron:mac`	On a MAC OS, builds your application and generates a `.app` file of your application that can be run on Mac