1.首先使用 vue create demoproject命令创建项目 2.在项目中使用命令 vue add electron-builder 这一部命令我是在vscode里面执行的,vscode使用的powershell对这个命令有限制,需要 执行set-ExecutionPolicy Unrestricted来允许。这一步,可能比较慢,建议更改npm源为国内镜像 3.执行npm install 三.使用vue来开发页面 1.确...
安装 Electron 在 Vue 项目中安装 Electron：npm install electron --save-dev 配置 Electron 在项目根目录下创建一个名为 electron.js 的文件，这个文件是 Electron 应用的入口文件。它将启动一个 Electron 应用并加载 Vue 的前端页面。electron.js 示例：const { app, BrowserWindow } = require('electron'); c...
cd vue-electron-notes进入项目跑一遍yarn serve,这个时候没什么问题就已经成功运行起来了! 2.2 在项目内集成Electron 进入我们项目的根目录,我们执行以下命令来安装插件vue-cli-plugin-electron-builder 代码语言:javascript 复制 vue add vue-cli-plugin-electron-builder 我们选择版本^6.0.0: 代码语言:javascript 复制...
Electron-vue界面 查看electron+vue 项目目录 项目目录 src目录下 background.js 文件 配置 electron 应用的一些设置。 如窗口大小 、 是否可以缩放、是否可以移动窗口等 Electron 应用打包 应用打包 使用 npm run electron:build 进行打包 打开项目目录 删除掉 node_modules 重新 cnpm install 如果还是无法打包 删除掉...
Electron-vue开发中推荐使用的组件包括:1、Element UI,2、Vuetify,3、Ant Design Vue,4、Vue Router,5、Vuex。这些组件可以帮助开发者快速构建高效、现代化的桌面应用。下面详细展开这些组件的介绍及其使用方法。 一、ELEMENT UI Element UI 是一套为开发者提供简洁、高效的 Vue 2.0 UI 组件库。它提供了丰富的组件...
electron-vue也有这个能力 为了做到这一点,他在你的开发机上起了http的服务; 然而你发布出来的程序,启动的时候,并没有在客户机上也开一个http的服务; 也就是说,开发机上调试程序,界面访问的是http://... 客户机上,运行程序界面加载的事:file://... 工程简述 他src目录下...
Vue开发Electron的方法主要包括以下3个步骤:1、初始化Vue项目,2、安装并配置Electron,3、开发与打包应用。 通过这三个步骤,我们可以将Vue与Electron结合,创建一个跨平台的桌面应用程序。以下是详细的步骤和解释。 一、初始化Vue项目 创建Vue项目 使用Vue CLI创建一个新
"scripts":{"dev":"vite","build":"vite build","preview":"vite preview","start":"cd electron && npm run start"}, 这样每次在根目录运行npm run start就可以了。 二.开发完毕,进入生产环节 1.打包vue:运行npm run build; 把dist文件夹的所有文件复制到electron文件夹下,index.html文件也替换掉。
vue init webpack electron-vue 1. 等待Vue项目初始化完成。 Vue项目创建完成,通过CMD命令行进入项目存放目录 或 代码编辑工具(vscode、webstorm)等直接打开该项目,执行命令:npm run dev npm run dev 1. 项目启动成功。 (2)、执行命令:npm run build 打包项目,项目打包完成以后会在项目文件夹内自动新建一个 di...
electron-vue不要再用了,版本太老作者也不更新,而且electron11.0才开始支持Apple Silicon(m1)机型。 近期我自己也在开发一些electron + vue的跨平台项目,本文主要记录一下新起一个项目的时候需要安装哪些工具与步骤 安装系统全局组件Vue CLI用于创建vue项目