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')