使用vue-cli-plugin-electron-builder创建electron+vue项目

在开始之前，请确保您已经安装了Node.js和npm。您还需要安装Vue CLI和Electron Builder。您可以通过以下命令进行安装：

1. 安装Vue CLI：

npm install -g @vue/cli

1. 安装Electron Builder：

npm install -g electron-builder

1. 安装vue-cli-plugin-electron-builder：

npm install -g @vue/cli-plugin-electron-builder

现在，您可以使用vue-cli创建一个新的Vue项目，并使用electron-builder插件将其转换为Electron应用程序。请按照以下步骤操作：

1. 创建一个新的Vue项目：

vue create my-electron-vue-app

1. 在创建项目时，选择Manually select features选项，然后选择Babel和Linter / Formatter。这将为您的项目配置必要的依赖项。
2. 进入项目目录：

cd my-electron-vue-app

1. 使用以下命令添加@vue/cli-plugin-electron-builder插件：

vue add electron-builder

这将自动为您配置项目以使用Electron Builder。您可以选择预设或手动配置选项。预设选项将为您提供一个基本的Electron应用程序。

1. 构建应用程序：在开发过程中，您可以使用以下命令启动开发服务器：

npm run serve:electron

这将启动一个开发服务器，并在浏览器中预览您的应用程序。每次保存文件时，应用程序将自动重新构建。

1. 构建生产版本的应用程序：在准备发布应用程序之前，您需要构建生产版本的应用程序。使用以下命令进行构建：

npm run build:electron:production

这将为您的应用程序创建一个生产构建，并将其输出到dist/electron目录中。您可以将该目录中的文件用于分发您的应用程序。

1. 自定义Electron应用程序：如果您需要自定义Electron应用程序，可以使用vue-cli-plugin-electron-builder提供的API和配置选项。您可以在项目的src/electron目录下找到与Electron相关的代码和配置文件。您可以根据需要修改这些文件来自定义您的应用程序。例如，您可以更改主进程文件（src/electron/main.js），添加自定义窗口行为或更改应用程序的图标等。
2. 打包应用程序：一旦您完成了应用程序的构建和自定义配置，您可以使用Electron Builder将其打包为可执行文件。使用以下命令进行打包：

npm run electron:package -- [options]

这将为您的应用程序创建一个可执行文件，并将其输出到dist目录中。您可以根据需要选择不同的打包选项，例如是否包含源代码、是否进行签名等。打包选项可以在package.json文件中进行配置。