NG-DISPLAY
Media Application for displaying Lyrics, Bible, Videos and more
Getting Started
Clone this repository locally:
git clone https://github.com/the-x-man/ng-display.git
Install dependencies with npm (used by Electron renderer process):
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
Install NodeJS dependencies with npm (used by Electron main process):
cd app/
npm install
Why two package.json ? This project follow Electron Builder two package.json structure in order to optimize final bundle and be still able to use Angular ng add
feature.
To build for development
- in a terminal window -> npm start
Voila! You can use your Angular + Electron app in a local development environment with hot reload!
The application code is managed by app/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 app/main.ts
.
Included Commands
Command | Description |
---|---|
npm run ng:serve |
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:build |
Builds your application and creates an app consumable based on your operating system |
Your application is optimised. Only /dist folder and NodeJS dependencies are included in the final bundle.
You want to use a specific lib (like rxjs) in electron main thread ?
YES! You can do it! Just by importing your library in npm dependencies section of app/package.json
with npm install --save XXXXX
.
It will be loaded by electron during build phase and added to your final bundle.
Then use your library by importing it in app/main.ts
file. Quite simple, isn't it?