https://github.com/resir014/angular-electron-starter
Angular 4 + Electron development, easier than ever!
https://github.com/resir014/angular-electron-starter
angular angular4 electron electron-app starter-kit
Last synced: about 1 year ago
JSON representation
Angular 4 + Electron development, easier than ever!
- Host: GitHub
- URL: https://github.com/resir014/angular-electron-starter
- Owner: resir014
- License: unlicense
- Created: 2017-09-14T07:16:52.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2017-11-27T00:33:14.000Z (over 8 years ago)
- Last Synced: 2025-02-08T08:47:26.472Z (about 1 year ago)
- Topics: angular, angular4, electron, electron-app, starter-kit
- Language: TypeScript
- Size: 215 KB
- Stars: 2
- Watchers: 4
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# angular-electron-starter
> Angular 4 + Electron development, easier than ever!
## Introduction
Currently runs with:
- Angular v4.3.5 (with Angular CLI)
- Electron v1.7.5
- electron-builder v19.27.7
### Getting Started
First, download a zipped copy of this repository [here](https://github.com/resir014/angular-electron-starter/archive/master.zip).
Extract it, `cd` into it, then install the dependencies with `npm`:
``` bash
$ npm install
```
If you want to generate Angular components with Angular CLI, you **MUST** install `@angular/cli` in npm global context. Follow [the Angular CLI documentation](https://github.com/angular/angular-cli) if you have used an older version of the Angular CLI before.
``` bash
npm install -g @angular/cli
```
### Building for development
You will need two terminal windows.
```bash
# First, run the incremental builder.
$ npm start
# Then, open another terminal window and start the Electron app
# in live-reload mode.
$ npm run electron:serve
```
The Angular root component contains an example of Electron library import. See [Using NodeJS Native libraries](#using-nodejs-native-libraries) if you want to import other native libraries in your project.
### Building for production
* Using development variables (environments/index.ts): `npm run electron:dev`
* Using production variables (environments/index.prod.ts): `npm run electron:prod`
Your built files are in the `/dist` folder.
## Included Commands
|Command|Description|
|--|--|
|`npm start`| Starts a development server on `localhost:4200`. |
|`npm run electron:linux`| Builds the app and creates an executable for Linux. |
|`npm run electron:windows`| Builds the app and creates an executable for 32-bit and 64-bit Windows systems. |
|`npm run electron:mac`| Builds the app and creates an executable for macOS. |
**Your application is optimised. Only the files of /dist folder are included in the executable.**
## Browser mode
Running `npm start` also runs a local development server on port 4200.
Note that importing native NodeJS modules can only be done on Electron mode. You can conditionally import native NodeJS modules by using conditional import utilising Electron's `remote` API.
```ts
if (this.electron.isElectron) {
const os = this.electron.remote.require('os');
this.runmode = `Running as an Electron app on ${os.platform()}.`;
} else {
this.runmode = 'Running as a web app.';
}
```
## Execute E2E tests
You can find end-to-end tests in /e2e folder.
```bash
# First, start a web server on port 4200
$ npm run start:web
# Then in another terminal window, launch Protractor (E2E framework)
$ npm run e2e
```
## Special thanks
* Maxime GRIS ([angular-electron](https://github.com/maximegris/angular-electron) starter kit)
# Contributors
[
](https://github.com/resir014)|[
](https://github.com/eryhM)|
:---:|:---:|
|[Resi Respati](https://github.com/resir014)|[Mhyre](https://github.com/eryhM)|