upgrade electron to 8 and update vue cli electron builder

package.json

@@ -38,7 +38,8 @@
     "@vue/cli-service": "^4.1.0",
     "@vue/eslint-config-prettier": "^5.0.0",
     "babel-eslint": "^10.0.3",
-    "electron": "^7.0.0",
+    "electron": "^8.0.0",
+    "electron-devtools-installer": "^3.2.0",
     "electron-notarize": "^0.2.1",
     "electron-updater": "^4.2.0",
     "eslint": "^5.16.0",
@@ -47,7 +48,7 @@
     "lint-staged": "^9.4.3",
     "prettier": "^1.19.1",
     "raw-loader": "^4.0.0",
-    "vue-cli-plugin-electron-builder": "https://github.com/netchampfaris/vue-cli-plugin-electron-builder",
+    "vue-cli-plugin-electron-builder": "^2.0.0",
     "vue-template-compiler": "^2.6.10"
   },
   "gitHooks": {

src/background.js

@@ -2,6 +2,7 @@
 
 import { app, protocol, BrowserWindow, ipcMain } from 'electron';
 import { autoUpdater } from 'electron-updater';
+import installExtension, { VUEJS_DEVTOOLS } from 'electron-devtools-installer'
 import {
   createProtocol
   // installVueDevtools
@@ -34,7 +35,7 @@ function createWindow() {
     width,
     height,
     webPreferences: {
-      nodeIntegration: true
+      nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION 
     },
     frame: isLinux,
     resizable: true
@@ -67,7 +68,7 @@ function createSettingsWindow(tab = 'General') {
     height: 577,
     backgroundColor: theme.backgroundColor.gray['200'],
     webPreferences: {
-      nodeIntegration: true
+      nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION 
     },
     resizable: false
   });
@@ -118,11 +119,11 @@ app.on('ready', async () => {
     // Electron will not launch with Devtools extensions installed on Windows 10 with dark mode
     // If you are not using Windows 10 dark mode, you may uncomment these lines
     // In addition, if the linked issue is closed, you can upgrade electron and uncomment these lines
-    // try {
-    //   await installVueDevtools();
-    // } catch (e) {
-    //   console.error('Vue Devtools failed to install:', e.toString());
-    // }
+    try {
+      await installExtension(VUEJS_DEVTOOLS);
+    } catch (e) {
+      console.error('Vue Devtools failed to install:', e.toString());
+    }
   }
   createWindow();
 });

src/pages/Dashboard/ProfitAndLoss.vue

@@ -59,7 +59,7 @@ export default {
 
     renderChart(res) {
       let totalRow = res.rows[res.rows.length - 1];
-      const chart = new Chart(this.$refs['profit-and-loss'], {
+      new Chart(this.$refs['profit-and-loss'], {
         title: '',
         animate: false,
         type: 'bar',

src/pages/ListView/ListView.vue

@@ -26,13 +26,13 @@
 </template>
 <script>
 import frappe from 'frappejs';
-import Observable from 'frappejs/utils/observable';
+// import Observable from 'frappejs/utils/observable';
 import PageHeader from '@/components/PageHeader';
 import Button from '@/components/Button';
 import SearchBar from '@/components/SearchBar';
 import List from './List';
 import listConfigs from './listConfig';
-import Icon from '@/components/Icon';
+// import Icon from '@/components/Icon';
 import FilterDropdown from '@/components/FilterDropdown';
 
 export default {
@@ -43,7 +43,7 @@ export default {
     List,
     Button,
     SearchBar,
-    Icon,
+    // Icon,
     FilterDropdown
   },
   activated() {

src/utils.js

@@ -211,7 +211,7 @@ export function makePDF(html, destination) {
     height: 842,
     show: false,
     webPreferences: {
-      nodeIntegration: true
+      nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION 
     }
   });
 

vue.config.js

@@ -2,6 +2,11 @@ const path = require('path');
 const webpack = require('webpack');
 
 module.exports = {
+  pluginOptions: {
+    electronBuilder: {
+      nodeIntegration: true
+    }
+  },
   pages: {
     index: {
       entry: 'src/main.js',