diff --git a/README.md b/README.md index 6f1ce55a2..5e169ae5d 100644 --- a/README.md +++ b/README.md @@ -15,9 +15,8 @@ Bootstrap and package your project with Angular 6(+) and Electron (Typescript + Currently runs with: -- Angular v6.0.3 -- Angular-CLI v6.0.3 -- Electron v2.0.1 +- Angular v6.0.6 +- Electron v2.0.3 - Electron Builder v20.13.4 With this sample, you can : @@ -64,7 +63,7 @@ You can desactivate "Developer Tools" by commenting `win.webContents.openDevTool |Command|Description| |--|--| -|`npm run ng:serve`| Execute the app in the browser | +|`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 @@ -76,17 +75,9 @@ You can desactivate "Developer Tools" by commenting `win.webContents.openDevTool ## Browser mode -Maybe you want to execute the application in the browser (WITHOUT HOT RELOAD ACTUALLY...) ? You can do it with `npm run ng:serve`. +Maybe you want to execute the application in the browser with hot reload ? You can do it with `npm run ng:serve:web`. Note that you can't use Electron or NodeJS native libraries in this case. Please check `providers/electron.service.ts` to watch how conditional import of electron/Native libraries is done. -## Error with nodejs third party packages - -Since Angular 6 does not provide an eject anymore, you can't configure your webpack config file to import node externals. - -An issue in [Angular repository](https://github.com/angular/angular-cli/issues/10681) is opened about this feature. - -Please have a look at [Stack Overflow Post workaround](https://stackoverflow.com/questions/50234196/after-updating-from-angular-5-to-6-i-keep-getting-the-error-cant-resolve-timer) that may work in some cases. Or use branch [angular5](https://github.com/maximegris/angular-electron/tree/angular5) and continue to eject your configuration file. - ## Branch & Packages version - Angular 4 & Electron 1 : Branch [angular4](https://github.com/maximegris/angular-electron/tree/angular4) diff --git a/package.json b/package.json index 1988634c5..1b67d32fd 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "angular-electron", - "version": "4.0.0", + "version": "4.1.0", "description": "Angular 6 with Electron (Typescript + SASS + Hot Reload)", "homepage": "https://github.com/maximegris/angular-electron", "author": { @@ -17,36 +17,40 @@ "main": "main.js", "private": true, "scripts": { - "postinstall": "npx electron-builder install-app-deps && node postinstall", + "postinstall": "npm run postinstall:electron && npx electron-builder install-app-deps", + "postinstall:web": "node postinstall-web", + "postinstall:electron": "node postinstall", "ng": "ng", - "start": "npm-run-all -p ng:serve electron:serve", - "build": "npm run electron:tsc && ng build", + "start": "npm run postinstall:electron && npm-run-all -p ng:serve electron:serve", + "build": "npm run postinstall:electron && npm run electron:tsc && ng build", "build:dev": "npm run build -- -c dev", "build:prod": "npm run build -- -c production", - "ng:serve": "ng serve -o", + "ng:serve": "ng serve", + "ng:serve:web": "npm run postinstall:web && ng serve -o", "electron:tsc": "tsc main.ts", "electron:serve": "wait-on http-get://localhost:4200/ && npm run electron:tsc && electron . --serve", "electron:local": "npm run build:prod && electron .", "electron:linux": "npm run build:prod && npx electron-builder build --linux", "electron:windows": "npm run build:prod && npx electron-builder build --windows", "electron:mac": "npm run build:prod && npx electron-builder build --mac", - "test": "ng test", - "e2e": "ng e2e" + "test": "npm run postinstall:web && ng test", + "e2e": "npm run postinstall:web && ng e2e" + }, + "dependencies": { }, - "dependencies": {}, "devDependencies": { "@angular-devkit/build-angular": "0.6.3", - "@angular/cli": "6.0.3", - "@angular/common": "6.0.3", - "@angular/compiler": "6.0.3", - "@angular/compiler-cli": "6.0.3", - "@angular/core": "6.0.3", - "@angular/forms": "6.0.3", - "@angular/http": "6.0.3", - "@angular/language-service": "6.0.3", - "@angular/platform-browser": "6.0.3", - "@angular/platform-browser-dynamic": "6.0.3", - "@angular/router": "6.0.3", + "@angular/cli": "6.0.6", + "@angular/common": "6.0.6", + "@angular/compiler": "6.0.6", + "@angular/compiler-cli": "6.0.6", + "@angular/core": "6.0.6", + "@angular/forms": "6.0.6", + "@angular/http": "6.0.6", + "@angular/language-service": "6.0.6", + "@angular/platform-browser": "6.0.6", + "@angular/platform-browser-dynamic": "6.0.6", + "@angular/router": "6.0.6", "@ngx-translate/core": "10.0.1", "@ngx-translate/http-loader": "3.0.1", "@types/jasmine": "2.8.7", @@ -54,7 +58,7 @@ "@types/node": "8.9.4", "codelyzer": "4.2.1", "core-js": "2.5.6", - "electron": "2.0.2", + "electron": "2.0.3", "electron-builder": "20.14.7", "electron-reload": "1.2.2", "jasmine-core": "3.1.0", @@ -68,7 +72,7 @@ "npx": "10.2.0", "protractor": "5.3.2", "rxjs": "6.1.0", - "ts-node": "6.0.3", + "ts-node": "6.0.6", "tslint": "5.10.0", "typescript": "2.7.2", "wait-on": "2.1.0", diff --git a/postinstall-web.js b/postinstall-web.js new file mode 100644 index 000000000..7dce76459 --- /dev/null +++ b/postinstall-web.js @@ -0,0 +1,16 @@ +// Allow angular using electron module (native node modules) +const fs = require('fs'); +const f_angular = 'node_modules/@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/browser.js'; + +fs.readFile(f_angular, 'utf8', function (err, data) { + if (err) { + return console.log(err); + } + var result = data.replace(/target: "electron-renderer",/g, ''); + var result = result.replace(/target: "web",/g, ''); + var result = result.replace(/return \{/g, 'return {target: "web",'); + + fs.writeFile(f_angular, result, 'utf8', function (err) { + if (err) return console.log(err); + }); +}); \ No newline at end of file diff --git a/postinstall.js b/postinstall.js index a1c8b5f0e..1fb127599 100644 --- a/postinstall.js +++ b/postinstall.js @@ -7,6 +7,7 @@ fs.readFile(f_angular, 'utf8', function (err, data) { return console.log(err); } var result = data.replace(/target: "electron-renderer",/g, ''); + var result = result.replace(/target: "web",/g, ''); var result = result.replace(/return \{/g, 'return {target: "electron-renderer",'); fs.writeFile(f_angular, result, 'utf8', function (err) { diff --git a/src/polyfills.ts b/src/polyfills.ts index 96d56459e..d3e73dd84 100644 --- a/src/polyfills.ts +++ b/src/polyfills.ts @@ -57,14 +57,14 @@ import 'core-js/es7/reflect'; * user can disable parts of macroTask/DomEvents patch by setting following flags */ - // (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame - // (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick - // (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames +// (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame +// (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick +// (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames - /* - * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js - * with the following flag, it will bypass `zone.js` patch for IE/Edge - */ +/* +* in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js +* with the following flag, it will bypass `zone.js` patch for IE/Edge +*/ // (window as any).__Zone_enable_cross_context_check = true; /***************************************************************************************************