网上的教程都是vue-cli2或者vue-electron的,没有关于cli3的文章,只能自己动手了。
electron-quick-start
git clone https://github.com/electron/electron-quick-start
运行
npm run start
vue-cli3
用vue-cli3新建一个项目,过程略过不说,
添加依赖
npm install --save-dev electron
npm install --save-dev electron-packager
然后把electron-quick-start下的main.js复制到vue-cli3的项目下,改名electron.js,
打开electron.js文件,修改
mainWindow.loadFile(`${__dirname}\\dist\\index.html`)//原文为mainWindow.loadFile('index.html')
把electron-quick-start下的package.json
"main": "main.js",
"scripts": {
"start": "electron ."
}
内容添加到vue项目的package.json
"main": "main.js",
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"electron_dev": "yarn run build && electron electron.js"
}
运行
yarn run electron_dev
就可以看到electron的界面了。