再战electron-vue

用着好好的electron软件突然出错了。是自己收集英语词根用的，一直没管，这两天有点时间，想重新组织一下。

似乎electron-vue不维护了，说要用vue-cli-plugin-electron-builder。那就重新学习一下electron。

安装node.js、vue-cli，这些不说了。以下记录一下大概的过程。

1.利用vue-cli构造vue项目（目录）

#vue create hello-world 

#cd hello-world

#vue add electron-builder

2.运行

#npm run electron:serve

3.问题

运行很长时间，界面很久才显示出来，并提示安装vue devTools安装失败。参照这个文章 ,另外找个目录下载代码自行生成工具。

#git clone https://github.com/vuejs/vue-devtools.git

#cd vue-devtools

#npm install

报错：

/bin/sh: tsc: command not found

于是安装ts

#npm install -g typescript

检查是否正常安装

#tsc -v

Version 4.6.3

#npm run build

报错：

lerna ERR! yarn run build exited 2 in '@vue/devtools-api'

lerna ERR! yarn run build stdout:

yarn run v1.22.11

$ rimraf lib && yarn build:esm && yarn build:cjs

$ tsc --module es2015 --outDir lib/esm -d

error TS2688: Cannot find type definition file for 'webpack-env'.

使用yarn安装一次

#yarn

安装一堆东西后，还是有一些错误，不过不重要。再次执行 npm

#npm run build

这回没有错误了，生成的目录与文中的有些出入。是在packages/shell-chrome，我将其拷贝到electron项目下，按文中说明修改了源代码。成功运行。