同时在script目录下创建相应的文件,接着我们就开始撰写者两个文件的代码了 调试脚本 通过Vite启动Web项目 调试脚本首先要做的工作就是启动Vue项目 让它跑在http://localhost下,这样我们修改渲染进程的代码时, 会通过Vite的热更新机制实时反馈到界面上 Vite除了提供cli的指令启动项目外,也提供了API,我这里就是直接调...
npm create vite@latest electron-desktop-tool 进入到项目 执行安装和运行命令,可以看到vue项目已经启动起来了 cd electron-desktop-tool npm install npm run dev 项目可以在浏览器中跑起来,说明没毛病,下一步就在项目中引入 electron 目录结构 这是目前的目录结构 安装electron 在安装 electron之前需要先配置一下 ...
npm install --save-dev vue-cli-plugin-electron-builder vue add electron-builder 配置Electron:在vue.config.js或electron-builder.config.js中配置Electron启动参数、打包选项等。 开发应用:编写Vue组件和逻辑,利用Electron的API访问系统资源。 调试与测试:利用Electron提供的调试工具或Vite的热模块替换功能进行快速开...
1)一个简单的 Electron 桌面应用都是冲 Hello World! 开始的。 以上是使用 electron-vue 超级迅速制作出来的 electron 桌面应用。 2)安装的组件 vue init simulatedgreg/electron-vue white-electron-first 1. 3)build tool choice ? 构建工具的选择,比较先进的是electron-builder。 实际上调试,开发可以直接选择 el...
1.创建一个vue3项目: npm create vite@latest electron-desktop-tool 2.在安装 electron之前需要先配置一下 安装源 在根目录下新建一个.npmrc文件 strict-ssl=falseregistry=https://registry.npmmirror.com/electron_mirror=https://registry.npmmirror.com/-/binary/electron/electron_builder_binaries_mirror=https...
vue版本:3.3.4 虽然是vue3.x版本,但是大部分的代码还是采用了vue2.x的语法去编写,这样让没有学过vue3的同学们,看起来更直观一点 Electron是一个用于构建跨平台桌面应用程序的开源框架,由 GitHub 开发和维护。它允许开发者使用HTML、CSS和JavaScript等前端技术,结合 Node.js 和 Chromium,创建可以在Windows、macOS和...
当使用 electron 加 vue3 进行开发时,如果不进行开发配置,需要在启动 vue 项目时,另开一个终端,单独启动 electron,同时在更改主进程代码时,窗口不会自动刷新,需要终结掉之前的 electron 启动进程,重新启动才能获取到最新的主进程更改。 为了方便开发,可以安装vite-plugin-electron和vite-plugin-electron-renderer这两个...
<electron-app> ✔ Select a framework: › vue ✔ Add TypeScript? … No / Yes ✔ Add Electron updater plugin? … No / Yes ✔ Enable Electron download mirror proxy? … No / Yes Scaffolding project in ./<electron-app>... Done. 接下来 npm install安装就可以了 3. 开发调试 ...
})//加载vue url视本地环境而定,如http://localhost:5173//win.loadURL('http://localhost:3000')//development模式if(process.env.VITE_DEV_SERVER_URL) { win.loadURL(process.env.VITE_DEV_SERVER_URL)//开启调试台win.webContents.openDevTools() ...