Override webpack configuration

.angular-cli.json

@@ -1,7 +1,8 @@
 {
   "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
   "project": {
-    "name": "angular-electron"
+    "name": "angular-electron",
+    "ejected": true
   },
   "apps": [
     {
@@ -21,7 +22,8 @@
       "styles": [
         "styles.scss"
       ],
-      "scripts": [],
+      "scripts": [
+      ],
       "environmentSource": "environments/environment.ts",
       "environments": {
         "dev": "environments/environment.ts",
@@ -52,6 +54,7 @@
   },
   "defaults": {
     "styleExt": "scss",
-    "component": {}
+    "component": {
+    }
   }
 }

README.md

@@ -40,7 +40,6 @@ Please follow [Angular-cli documentation](https://github.com/angular/angular-cli
 npm install -g @angular/cli
 ```
 
-
 ## To build for development
 
 **in a terminal window** -> npm start  
@@ -64,3 +63,16 @@ You can find your built files in the /dist directory.
 - `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.
 
 **Your application is optimised. There are only the files of /dist folder in the generated executable.**
+
+## Use NodeJS Native libraries
+
+By default, Angular-Cli doesn't seem to be able to import nodeJS native libs or electron libs during compilation time.
+If you need to use NodeJS native libraries like 'fs' or 'os', you MUST add it manually in the file `webpack.config.js` in root directory :
+
+```javascript
+  "externals": {
+    "child_process": 'require(\'child_process\')',
+    "electron": 'require(\'electron\')',
+    "fs": 'require(\'fs\')'
+  },
+```

package.json

@@ -1,6 +1,6 @@
 {
   "name": "angular-electron",
-  "version": "1.0.3",
+  "version": "1.1.0",
   "description": "Angular 4 with Electron (Typescript + SASS)",
   "homepage": "",
   "author": {
@@ -17,11 +17,13 @@
   "private": true,
   "scripts": {
     "ng": "ng",
-    "start": "ng serve",
-    "build": "ng build && copyfiles main.js dist",
-    "test": "ng test",
+    "start": "webpack-dev-server --port=4200",
+    "test": "karma start ./karma.conf.js",
     "lint": "ng lint",
-    "e2e": "ng e2e",
+    "e2e": "protractor ./protractor.conf.js",
+    "build": "webpack && copyfiles main.js dist",
+    "prepree2e": "npm start",
+    "pree2e": "webdriver-manager update --standalone false --gecko false --quiet",
     "electron:serve": "electron . --serve",
     "electron:dist": "npm run build && electron dist/main.js",
     "electron:linux": "npm run build && copyfiles package.json dist && electron-packager dist --overwrite --platform=linux --arch=x64 --asar=true  --out=app-builds",
@@ -44,25 +46,47 @@
   "devDependencies": {
     "@angular/cli": "1.0.0",
     "@angular/compiler-cli": "~4.0.0",
-    "@types/jasmine": "2.5.38",
-    "@types/node": "~6.0.60",
+    "@types/electron": "~1.4.35",
+    "@types/jasmine": "~2.5.38",
+    "@types/node": "~7.0.12",
+    "autoprefixer": "~6.5.3",
     "codelyzer": "~2.0.0",
-    "copyfiles": "^1.2.0",
-    "electron": "1.6.2",
+    "copyfiles": "~1.2.0",
+    "css-loader": "~0.26.1",
+    "cssnano": "~3.10.0",
+    "electron": "~1.6.2",
     "electron-packager": "~8.6.0",
     "electron-prebuilt": "~1.4.13",
+    "exports-loader": "~0.6.3",
+    "file-loader": "~0.10.0",
+    "istanbul-instrumenter-loader": "~2.0.0",
     "jasmine-core": "~2.5.2",
     "jasmine-spec-reporter": "~3.2.0",
+    "json-loader": "~0.5.4",
     "karma": "~1.4.1",
     "karma-chrome-launcher": "~2.0.0",
     "karma-cli": "~1.0.1",
     "karma-coverage-istanbul-reporter": "~0.2.0",
     "karma-jasmine": "~1.1.0",
     "karma-jasmine-html-reporter": "~0.2.2",
+    "karma-sourcemap-loader": "~0.3.7",
+    "less-loader": "~2.2.3",
+    "postcss-loader": "~0.13.0",
+    "postcss-url": "~5.1.2",
     "protractor": "~5.1.0",
+    "raw-loader": "~0.5.1",
+    "sass-loader": "~4.1.1",
+    "script-loader": "~0.7.0",
+    "source-map-loader": "~0.1.5",
+    "style-loader": "~0.13.1",
+    "stylus-loader": "~2.4.0",
     "ts-node": "~2.0.0",
     "tslint": "~4.5.0",
-    "typescript": "~2.2.0"
+    "typescript": "~2.2.0",
+    "url-loader": "~0.5.7",
+    "webdriver-manager": "~12.0.4",
+    "webpack": "~2.3.3",
+    "webpack-dev-server": "~2.4.2"
   },
   "license": "SEE LICENSE IN LICENSE.md"
 }

src/app/app.component.ts

@@ -1,4 +1,6 @@
 import { Component } from '@angular/core';
+import { ipcRenderer } from 'electron';
+import * as childProcess from 'child_process';
 
 @Component({
   selector: 'app-root',
@@ -7,4 +9,12 @@ import { Component } from '@angular/core';
 })
 export class AppComponent {
   title = 'app works!';
-}
+
+  constructor() {
+    // Check if electron is correctly injected (see externals in webpack.config.js)
+    console.log('c', ipcRenderer);
+    // Check if nodeJs childProcess is correctly injected (see externals in webpack.config.js)
+    console.log('c', childProcess);
+
+  }
+}