// 方式一：基于electron-vue 創(chuàng)建新項(xiàng)目
vue init simulatedgreg/electron-vue 項(xiàng)目名 
// 方式二：在現(xiàn)有的vue項(xiàng)目中安裝electron包
vue add electron-builder

vue init simulatedgreg/electron-vue 項(xiàng)目名 

{
  "name": "name",
  "version": "0.0.1",
  "author": "jmyinjg <jmyinjg@163.com>",
  "description": "An electron-vue project",
  "license": null,
  "main": "./dist/electron/main.js",
  "scripts": {
    "build": "node .electron-vue/build.js && electron-builder",
    "build:dir": "node .electron-vue/build.js && electron-builder --dir",
    "build:clean": "cross-env BUILD_TARGET=clean node .electron-vue/build.js",
    "build:web": "cross-env BUILD_TARGET=web node .electron-vue/build.js",
    "dev": "node .electron-vue/dev-runner.js",
    "pack": "npm run pack:main && npm run pack:renderer",
    "pack:main": "cross-env NODE_ENV=production webpack --progress --colors --config .electron-vue/webpack.main.config.js",
    "pack:renderer": "cross-env NODE_ENV=production webpack --progress --colors --config .electron-vue/webpack.renderer.config.js",
    "postinstall": ""
  },
  "build": {
    "productName": "midtools",
    "appId": "com.jthe.midtools",
    "directories": {
      "output": "build"
    },
    "files": [
      "dist/electron/**/*"
    ],
    "dmg": {
      "contents": [
        {
          "x": 410,
          "y": 150,
          "type": "link",
          "path": "/Applications"
        },
        {
          "x": 130,
          "y": 150,
          "type": "file"
        }
      ]
    },
    "mac": {
      "icon": "build/icons/icon.icns"
    },
    "win": {
      "icon": "build/icons/icon.ico"
    },
    "linux": {
      "icon": "build/icons"
    }
  },
  "dependencies": {
    "@jmyinjg/topsdk": "^1.6.0",
    "ali-oss": "^6.9.0",
    "axios": "^0.18.0",
    "cheerio": "^1.0.0-rc.3",
    "iconv-lite": "^0.5.1",
    "mysql": "^2.18.1",
    "request": "^2.88.2",
    "superagent": "^5.2.2",
    "uuid": "^8.1.0",
    "view-design": "^4.2.0",
    "vue": "^2.5.16",
    "vue-electron": "^1.0.6",
    "vue-router": "^3.0.1",
    "vuex": "^3.0.1",
    "vuex-electron": "^1.0.0"
  },
  "devDependencies": {
    "ajv": "^6.5.0",
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.4",
    "babel-minify-webpack-plugin": "^0.3.1",
    "babel-plugin-import": "^1.13.0",
    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-stage-0": "^6.24.1",
    "babel-register": "^6.26.0",
    "cfonts": "^2.1.2",
    "chalk": "^2.4.1",
    "copy-webpack-plugin": "^4.5.1",
    "cross-env": "^5.1.6",
    "css-loader": "^0.28.11",
    "del": "^3.0.0",
    "devtron": "^1.4.0",
    "electron": "^2.0.4",
    "electron-builder": "^20.19.2",
    "electron-debug": "^1.5.0",
    "electron-devtools-installer": "^2.2.4",
    "file-loader": "^1.1.11",
    "html-webpack-plugin": "^3.2.0",
    "mini-css-extract-plugin": "0.4.0",
    "multispinner": "^0.2.1",
    "node-loader": "^0.6.0",
    "style-loader": "^0.21.0",
    "url-loader": "^1.0.1",
    "vue-html-loader": "^1.2.4",
    "vue-loader": "^15.2.4",
    "vue-style-loader": "^4.1.0",
    "vue-template-compiler": "^2.5.16",
    "webpack": "^4.15.1",
    "webpack-cli": "^3.0.8",
    "webpack-dev-server": "^3.1.4",
    "webpack-hot-middleware": "^2.22.2",
    "webpack-merge": "^4.1.3"
  }
}

vue add electron-builder

{
  "name": "name",
  "productName": "應(yīng)用名稱",
  "version": "1.5.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint",
    "electron:build": "vue-cli-service electron:build",
    "electron:serve": "vue-cli-service electron:serve",
    "postinstall": "electron-builder install-app-deps",
    "postuninstall": "electron-builder install-app-deps"
  },
  "main": "background.js",
  "dependencies": {
    "axios": "~0.21.1",
    "core-js": "~3.15.2",
    "vue": "~3.1.5",
    "vue-axios": "~3.2.4",
    "vue-router": "~4.0.10",
    "vuex": "~4.0.2",
    ......
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.13",
    "@vue/cli-plugin-eslint": "~4.5.13",
    "@vue/cli-plugin-router": "~4.5.13",
    "@vue/cli-plugin-vuex": "~4.5.13",
    "@vue/cli-service": "~4.5.13",
    "@vue/compiler-sfc": "~3.1.5",
    "babel-eslint": "~10.1.0",
    "compression-webpack-plugin": "~6.1.1",
    "electron": "^12.0.0",
    "electron-devtools-installer": "^3.1.0",
    "eslint": "~6.8.0",
    "eslint-plugin-vue": "~7.13.0",
    "postcss": "~8.3.5",
    "vue-cli-plugin-electron-builder": "~2.1.1"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not dead"
  ]
}

npm run electron:serve

'use strict'
import { app, protocol, BrowserWindow } from 'electron'
import { createProtocol } from 'vue-cli-plugin-electron-builder/lib'
import installExtension, { VUEJS_DEVTOOLS } from 'electron-devtools-installer'
const isDevelopment = process.env.NODE_ENV !== 'production'
protocol.registerSchemesAsPrivileged([
  { scheme: 'app', privileges: { secure: true, standard: true } }
])
// 創(chuàng)建主窗口
async function createWindow() {
  const win = new BrowserWindow({
    width: 800, // 窗口的默認(rèn)寬度
    height: 600, // 窗口的默認(rèn)高度
    title: '當(dāng)前窗口的標(biāo)題',
    webPreferences: {
      nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION,
      contextIsolation: !process.env.ELECTRON_NODE_INTEGRATION
    }
  })
  if (process.env.WEBPACK_DEV_SERVER_URL) {
    await win.loadURL(process.env.WEBPACK_DEV_SERVER_URL)
    // 開發(fā)環(huán)境下，打開調(diào)試工具
    if (!process.env.IS_TEST) win.webContents.openDevTools()
  } else {
    createProtocol('app')
    // 主窗口創(chuàng)建完成后進(jìn)入到
    win.loadURL('app://./index.html')
  }
}
// 監(jiān)聽整個(gè)應(yīng)用的關(guān)閉操作
app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
  	// 關(guān)閉應(yīng)用
    app.quit()
  }
})
app.on('activate', () => {
  if (BrowserWindow.getAllWindows().length === 0) createWindow()
})
app.on('ready', async () => {
  if (isDevelopment && !process.env.IS_TEST) {
    try {
      await installExtension(VUEJS_DEVTOOLS)
    } catch (e) {
      console.error('Vue Devtools failed to install:', e.toString())
    }
  }
  createWindow()
})
if (isDevelopment) {
  if (process.platform === 'win32') {
    process.on('message', (data) => {
      if (data === 'graceful-exit') {
        app.quit()
      }
    })
  } else {
    process.on('SIGTERM', () => {
      app.quit()
    })
  }
}

import {BrowserWindow, Menu } from 'electron'
let mainWin
// 主窗口的頂欄菜單
const template = [
  {
    label: '后退',
    click: () => {
    // 判斷 瀏覽器是否可以后退到前一頁面。
      if (mainWin.webContents.canGoBack()) {
      // 使瀏覽器回退到上一個(gè)頁面。
        mainWin.webContents.goBack();
      }
    }
  },
  {
    label: '前進(jìn)',
    click: () => {
   	 // 判斷 瀏覽器是否可以前進(jìn)到下一頁面。
      if (mainWin.webContents.canGoForward()) {
      // 使瀏覽器前進(jìn)到下一個(gè)頁面。
        mainWin.webContents.goForward();
      }
    }
  },
  {
    label: '刷新',
    click: () => {
      mainWin.webContents.reloadIgnoringCache();
    }
  },
];
// 右鍵菜單
const contextMenu = Menu.buildFromTemplate([
  { label: '復(fù)制', role: 'copy' },
  { label: '粘貼', role: 'paste' }
]);
async function createWindow() {
	mainWin = new BrowserWindow({
		...
	})
   // 部署頂欄菜單
  const menu = Menu.buildFromTemplate(template);
  Menu.setApplicationMenu(menu);
  // 部署右鍵菜單
  mainWin.webContents.on('context-menu', () => {
    contextMenu.popup({ window: mainWin }); // 在指定窗口上顯示上下文菜單
  });
}

import { BrowserWindow, dialog } from 'electron'
let mainWin
async function createWindow() {
	mainWin = new BrowserWindow({
		...
	})
  // 監(jiān)聽 主窗口 右上角的關(guān)閉事件
  mainWin.on('close', (e) => {
    e.preventDefault(); // 阻止窗口默認(rèn)的關(guān)閉行為
    /**
	* 彈出 對話框詢問用戶是否真的想要退出
	* 這里的choice 值是buttons的索引，
	* 例如點(diǎn)擊了“否”，則choice=0；點(diǎn)擊了“是”，則choice=1
	* 注意：如果點(diǎn)擊了右上角的叉，則choice=0，所以，“是”只能寫在“否”后面
	*/ 
    const choice = dialog.showMessageBoxSync(null, {
      type: 'info',
      buttons: ['否', '是'],
      title: '退出',
      message: '確定要退出嗎？再次開啟需重新登錄',
    });
    // 如果用戶選擇“是”，則關(guān)閉窗口
    if (choice === 1) {
      // 關(guān)閉窗口并釋放內(nèi)存
      mainWin.destroy(); // 關(guān)閉主窗口
      app.quit()
    }
  })
}

import { BrowserWindow, ipcMain, screen } from 'electron'
let mainWinRoutePath = '/'; // 主窗口的當(dāng)前路由
let mainWin, ballWin
async function createSBallWindow() {
	mainWin = new BrowserWindow({
		...
	})
	...
}
// 創(chuàng)建 工具球窗口
async function createSBallWindow() {
  ballWin = new BrowserWindow({
    width: 65, // 懸浮窗口的寬度 比實(shí)際DIV的寬度要多5px，用于處理陰影
    height: 65, // 懸浮窗口的高度 比實(shí)際DIV的高度要多5px，用于處理陰影
    type: 'toolbar',  //創(chuàng)建的窗口類型為工具欄窗口
    frame: false,  // 是否創(chuàng)建有邊框的窗口(含最大化/最小化/關(guān)閉功能)，false創(chuàng)建無邊框窗口
    resizable: false, // 是否允許窗口大小縮放
    movable: true, // 是否可以移動(dòng)
    show: true,  // 是否在創(chuàng)建完成后，讓窗口顯示，如果希望在用戶登錄后再顯示工具球，則設(shè)置成false，再通過消息來打開窗口
    transparent: true, // 設(shè)置透明，只有在frame為false時(shí)才能生效
    hasShadow: false, // 是否顯示陰影
    alwaysOnTop: true, // 窗口是否總是顯示在其他窗口之前
    webPreferences: {
      // devTools: true, // 是否打開調(diào)試工具，如果要打開調(diào)試，最好把窗口的默認(rèn)大小調(diào)大一些，且不要設(shè)置初始位置
      nodeIntegration: true,
      contextIsolation: false,
    }
  })
  // 通過獲取用戶屏幕的寬高來設(shè)置懸浮球的初始位置，最好把窗口的默認(rèn)大小調(diào)大一些，且不要設(shè)置初始位置
  const size = screen.getPrimaryDisplay().workAreaSize
  ballWin.setPosition(size.width - 150, size.height - 200) // 設(shè)置懸浮球位置
  if (process.env.WEBPACK_DEV_SERVER_URL) {
    await ballWin.loadURL(`${process.env.WEBPACK_DEV_SERVER_URL}ball`)
    // ballWin.webContents.openDevTools(); // 打開調(diào)試工具
  } else {
    await ballWin.loadURL('app://./ball.html')
  }
  ballWin.on('close', () => {
    ballWin = null
  })
}
// 監(jiān)聽 open-mainWin-window 消息，  顯示 主窗口
ipcMain.on('open-mainWin-window', () => {
  if (!mainWin) {
    return
  }
  mainWin.maximize()  // 窗口最大化
})
// 顯示 工具球窗口
ipcMain.on('open-ballWin-window', () => {
  if (ballWin) {
    ballWin.show()
  } else {
  // 若窗口不存在，則先創(chuàng)建窗口再顯示
    createSBallWindow()
    ballWin.show()
  }
});
// 隱藏 工具球窗口
ipcMain.on('hide-ballWin-window', () => {
  ballWin.hide()
});
// 保存主窗口的當(dāng)前路由
ipcMain.on('route-change', (event, route) => {
  mainWinRoutePath = route;
});
// 返回保存的路由信息
ipcMain.handle('get-mainWin-route', () => {
  return mainWinRoutePath;
});
// 進(jìn)入 主窗口的某個(gè)頁面
ipcMain.on('change-page', async (event, url) => {
  if (process.env.WEBPACK_DEV_SERVER_URL) {
    // 去除url開頭的/ 避免造成 http://localhost:8080//...
    await mainWin.loadURL(`${process.env.WEBPACK_DEV_SERVER_URL}${url.replace(/^\//, '')}`)
  } else {
    await mainWin.loadURL(`app://.${url}`)
  }
})

<template>
  <div class="ball" @click="goFast">
    <!-- dblclick雙擊 -->
    <span>工具球</span>
  </div>
</template>
<script>
// 判斷是否在 electron 平臺的環(huán)境當(dāng)中
let ipcRenderer = null
const isElectron = navigator.userAgent.toLowerCase().indexOf(' electron/') >= 0
if (isElectron) {
  ipcRenderer = require('electron').ipcRenderer
}
export default {
  name: "ball",
  data() {
    return {
    }
  },
  created() {
  },
  methods: {
    goFast() {
      if (isElectron) {
        ipcRenderer.invoke('get-mainWin-route').then((route) => {
          if (route != '/moral/record') {
            // 消息名稱、傳參arg
            ipcRenderer.send('change-page', '/ball')
          }
          // 發(fā)送 open-ballWin-window 消息
          ipcRenderer.send('open-mainWin-window')
        });
      }
    }
  },
}
</script>
<style>
body {
  background: transparent;
  display: flex;
  justify-content: center;
  height: 100%;
  // 這個(gè)是用于 移動(dòng)窗口
  /* -webkit-app-region: drag; */
}
.ball {
  width: 60px;
  height: 60px;
  line-height: 60px;
  border-radius: 50%;
  box-sizing: border-box;
  background: var(--primary-color);
  box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.4);
  color: #fff;
  background: linear-gradient(#40a9ff, #096dd9);
  text-align: center;
  cursor: pointer;
  font-size: 14px;
  /* -webkit-app-region: no-drag; */
}
</style>

import { createRouter, createWebHistory } from 'vue-router';
// 判斷是否在 electron 平臺的環(huán)境當(dāng)中
const isElectron = navigator.userAgent.toLowerCase().indexOf(' electron/') >= 0
let ipcRenderer = null
if (isElectron) {
  ipcRenderer = require('electron').ipcRenderer
}
const router = createRouter({
  routes: [
	  {
	    path: '/index',
   		component: () => import('@/views/index'),
	    meta: { title: '首頁' },
	  },
	  {
	    path: '/ball',
	    component: () => import('@/views/ball'),
	    meta: { title: '工具球' }
	  },
	  ...
  ],
  history: createWebHistory()
});
// 路由守衛(wèi)
router.beforeEach((to, from, next) => {
  if (isElectron) {
    ipcRenderer.send('route-change', to.path)
  }
  next()
})
export default router;

// 置頂并顯示 主窗口
ipcMain.on('open-mainWin-window', () => {
  if (!mainWin) {
    return
  }
  mainWin.maximize()  // 窗口最大化
  // 當(dāng) ballWin 失去置頂狀態(tài)時(shí)，將 mainWin 的置頂級別設(shè)為較高值
  mainWin.setAlwaysOnTop(true, 'normal', 1);
  mainWin.focus(); // 讓窗口獲得焦點(diǎn)
  mainWin.setAlwaysOnTop(false); // 如果不希望它一直保持在最上層，可以之后立即取消置頂，即點(diǎn)擊其他應(yīng)用時(shí)，當(dāng)前窗口會(huì)下移一層
})

import { globalShortcut } from 'electron'
let mainWin, ballWin 
...
 // 全局快捷鍵 刷新
  globalShortcut.register('F5', () => {
    if (mainWin && ballWin) {
      mainWin.webContents.reloadIgnoringCache();
      ballWin.webContents.reloadIgnoringCache();
    }
  })

'use strict'
import { app, protocol, BrowserWindow, ipcMain, dialog, Menu, screen, globalShortcut } from 'electron'
import { createProtocol } from 'vue-cli-plugin-electron-builder/lib'
import installExtension, { VUEJS_DEVTOOLS } from 'electron-devtools-installer'
const path = require('path');
const isDevelopment = process.env.NODE_ENV !== 'production'
protocol.registerSchemesAsPrivileged([
  { scheme: 'app', privileges: { secure: true, standard: true } }
])
let mainWinRoutePath = '/'; // 主窗口的當(dāng)前路由
let mainWin, ballWin
// 主窗口的頂欄菜單
const template = [
  {
    label: '后退',
    click: () => {
      if (mainWin.webContents.canGoBack()) {
        mainWin.webContents.goBack();
      }
    }
  },
  {
    label: '前進(jìn)',
    click: () => {
      if (mainWin.webContents.canGoForward()) {
        mainWin.webContents.goForward();
      }
    }
  },
  {
    label: '刷新',
    click: () => {
      mainWin.webContents.reloadIgnoringCache();
    }
  },
];
// 右鍵菜單
const contextMenu = Menu.buildFromTemplate([
  { label: '復(fù)制', role: 'copy' },
  { label: '粘貼', role: 'paste' }
]);
async function createWindow() {
  mainWin = new BrowserWindow({
    width: 800,
    height: 800,
    title: '智慧校園',
    icon: path.join(__dirname, process.env.VUE_APP_LOGO),
    webPreferences: {
      nodeIntegration: process.env.ELECTRON_NODE_INTEGRATION,
      contextIsolation: !process.env.ELECTRON_NODE_INTEGRATION
    }
  })
  const menu = Menu.buildFromTemplate(template);
  Menu.setApplicationMenu(menu);
  mainWin.webContents.on('context-menu', () => {
    contextMenu.popup({ window: mainWin }); // 在指定窗口上顯示上下文菜單
  });
  if (process.env.WEBPACK_DEV_SERVER_URL) {
    await mainWin.loadURL(process.env.WEBPACK_DEV_SERVER_URL + 'index')
    if (!process.env.IS_TEST) mainWin.webContents.openDevTools()
  } else {
    createProtocol('app')
    mainWin.loadURL('app://./index.html')
  }
  // 監(jiān)聽 主窗口 右上角的關(guān)閉事件
  mainWin.on('close', (e) => {
    e.preventDefault(); // 阻止窗口默認(rèn)的關(guān)閉行為
    // 顯示一個(gè)對話框詢問用戶是否真的想要退出
    const choice = dialog.showMessageBoxSync(null, {
      type: 'info',
      buttons: ['否', '是'],
      title: '退出',
      message: '確定要退出嗎？再次開啟需重新登錄',
    });
    // 如果用戶選擇“是”，則關(guān)閉窗口
    if (choice === 1) {
      // 關(guān)閉窗口并釋放內(nèi)存
      mainWin.destroy(); // 關(guān)閉主窗口
      app.quit()
    }
  })
  mainWin.once('ready-to-show', () => {
    mainWin.show()
  })
}
// 創(chuàng)建 工具球窗口
async function createSBallWindow() {
  ballWin = new BrowserWindow({
    width: 65, // 懸浮窗口的寬度 比實(shí)際DIV的寬度要多5px
    height: 65, // 懸浮窗口的高度 比實(shí)際DIV的高度要多5px
    type: 'toolbar',  //創(chuàng)建的窗口類型為工具欄窗口
    frame: false,  // 是否創(chuàng)建有邊框的窗口(含最大化/最小化/關(guān)閉功能)，false創(chuàng)建無邊框窗口
    resizable: false, // 是否允許窗口大小縮放
    movable: true, // 是否可以移動(dòng)
    show: true,  // 是否在創(chuàng)建完成后，讓窗口顯示
    transparent: true, // 設(shè)置透明
    hasShadow: false, // 是否顯示陰影
    alwaysOnTop: true, // 窗口是否總是顯示在其他窗口之前
    webPreferences: {
      // devTools: true, // 是否打開調(diào)試工具，打開調(diào)試則最好調(diào)整窗口的大小
      nodeIntegration: true,
      contextIsolation: false,
    }
  })
  // 通過獲取用戶屏幕的寬高來設(shè)置懸浮球的初始位置
  const size = screen.getPrimaryDisplay().workAreaSize
  ballWin.setPosition(size.width - 150, size.height - 200) // 設(shè)置懸浮球位置
  if (process.env.WEBPACK_DEV_SERVER_URL) {
    await ballWin.loadURL(`${process.env.WEBPACK_DEV_SERVER_URL}ball`)
    // ballWin.webContents.openDevTools(); // 打開調(diào)試工具
  } else {
    await ballWin.loadURL('app://./ball.html')
  }
  ballWin.on('close', () => {
    ballWin = null
  })
}
app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit()
  }
})
// 置頂并顯示 主窗口
ipcMain.on('open-mainWin-window', () => {
  if (!mainWin) {
    return
  }
  mainWin.maximize()  // 窗口最大化
  if (ballWin) {
    ballWin.on('always-on-top-changed', (event, isAlwaysOnTop) => {
      if (isAlwaysOnTop) {
        // 當(dāng) ballWin 處于最頂端時(shí)，將 mainWin 的置頂級別設(shè)為較低值
        mainWin.setAlwaysOnTop(true, 'normal', -1);
        mainWin.focus(); // 讓窗口獲得焦點(diǎn)
      } else {
        // 當(dāng) ballWin 失去置頂狀態(tài)時(shí)，將 mainWin 的置頂級別設(shè)為較高值
        mainWin.setAlwaysOnTop(true, 'normal', 1);
        mainWin.focus();
        mainWin.setAlwaysOnTop(false); // 如果不希望它一直保持在最上層，可以之后立即取消置頂
      }
    })
    ballWin.setAlwaysOnTop(true, 'normal', 1)
  } else {
    mainWin.setAlwaysOnTop(true);
    mainWin.focus();
    mainWin.setAlwaysOnTop(false);
  }
})
// 隱藏 主窗口
ipcMain.on('hide-mainWin-window', () => {
  mainWin.hide()
})
// 顯示 工具球窗口
ipcMain.on('open-ballWin-window', () => {
  if (ballWin) {
    ballWin.show()
  } else {
    createSBallWindow()
    ballWin.show()
  }
});
// 隱藏 工具球窗口
ipcMain.on('hide-ballWin-window', () => {
  ballWin.hide()
});
// 保存主窗口的當(dāng)前路由
ipcMain.on('route-change', (event, route) => {
  mainWinRoutePath = route;
});
// 返回保存的路由信息
ipcMain.handle('get-mainWin-route', () => {
  return mainWinRoutePath;
});
// 進(jìn)入 主窗口的某個(gè)頁面
ipcMain.on('change-page', async (event, url) => {
  if (process.env.WEBPACK_DEV_SERVER_URL) {
    // 去除url開頭的/ 避免造成 http://localhost:8080//...
    await mainWin.loadURL(`${process.env.WEBPACK_DEV_SERVER_URL}${url.replace(/^\//, '')}`)
  } else {
    await mainWin.loadURL(`app://.${url}`)
  }
})
app.on('activate', () => {
  if (BrowserWindow.getAllWindows().length === 0) createWindow()
})
app.on('ready', async () => {
  if (isDevelopment && !process.env.IS_TEST) {
    try {
      await installExtension(VUEJS_DEVTOOLS)
    } catch (e) {
      console.error('Vue Devtools failed to install:', e.toString())
    }
  }
  //創(chuàng)建主窗口
  createWindow()
  //創(chuàng)建球形窗口
  createSBallWindow()
  // 注冊 全局快捷鍵 刷新
   globalShortcut.register('F5', () => {
    if (mainWin && ballWin) {
      mainWin.webContents.reloadIgnoringCache();
      ballWin.webContents.reloadIgnoringCache();
    }
   })
})
if (isDevelopment) {
  if (process.platform === 'win32') {
    process.on('message', (data) => {
      if (data === 'graceful-exit') {
        app.quit()
      }
    })
  } else {
    process.on('SIGTERM', () => {
      app.quit()
    })
  }
}

用cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org
或者直接用npm
npm config set registry https://registry.npmmirror.com