electron-vue安装及初始化报错处理

安装electron-vue

参考文档

https://simulatedgreg.gitbooks.io/electron-vue/content/cn/

1.安装前首先需要安装vue-cli

npm install -g vue-cli

2.安装electron-vue

vue init simulatedgreg/electron-vue my-project

3.一直按Enter键，ESLint和Karma + Mocha根据自己的需求选装（图下是没有进行安装）

4.安装依赖

cd my-project // 进入项目
npm install   // 安装依赖

5.启动项目

npm run dev

初始化报错处理

1.控制台，如下报错

http://localhost:9080/__webpack_hmr 404 (Not Found)

解决方案：

在.electron-vue的文件夹中的dev-runner.js文件

1.注释掉hot
2.将原来的 app.use(hotMiddleware)注释打开

2.如果输出终端，有如下报错

错误原因是，在生成桌面的应用的时候，没有vue-devtools插件，则会报错，并会重复请求，直至超时
解决方式，如下

在src/main/index.dev.js文件做如下修改

/**
 * This file is used specifically and only for development. It installs
 * `electron-debug` & `vue-devtools`. There shouldn't be any need to
 *  modify this file, but it can be used to extend your development
 *  environment.
 */

/* eslint-disable */

// Install `electron-debug` with `devtron`
require('electron-debug')({ showDevTools: true })
import {  BrowserWindow } from 'electron';
// Install `vue-devtools`
require('electron').app.on('ready', () => {
  let installExtension = require('electron-devtools-installer')
  // installExtension.default(installExtension.VUEJS_DEVTOOLS)
  //   .then(() => {})
  //   .catch(err => {
  //     console.log('Unable to install `vue-devtools`: \n', err)
  //   })
	
	BrowserWindow.addDevToolsExtension('devTools/vue-devtools')
})

// Require `main` process to boot app
require('./index')