在很多情况下需要创建electron-vue模板,以下常用的常见套路

创建vue项目

vue create my-electron-template

添加electron-builder依赖

cd my-electron-template
vue add electron-builder

构建脚本

yarn

yarn run electron:serve

yarn run electron:build

添加vue.config.js

由于前端可能需要访问electron的一些内容,因此需要配置vue.config.js文件,避免产生构建失败的问题

module.exports = {
    pluginOptions: {
        electronBuilder: {
            nodeIntegration: true,
            builderOptions: {
                "appId": "com.xiaor.roboticmaster",
                "productName": "RoboticMaster",//项目名,也是生成的安装文件名
                "copyright": "Copyright © 2021, Powered by ceoifung.",//版权信息
                "directories": {
                    "output": "./dist"//输出文件路径,之前编译的默认是dist_electron
                },
                "win": {
                    "icon": "./build/logo.ico",//图标路径
                },
                "linux": {
                    "target": "deb"
                },
                "extraResources": { // 拷贝dll等静态文件到指定位置
                    "from": "./static/conf.ini",
                    "to": "conf.ini"
                },
                // options placed here will be merged with default configuration and passed to electron-builder
            }
        }
    }
}