cd vue-electron-notes进入项目跑一遍yarn serve,这个时候没什么问题就已经成功运行起来了! 2.2 在项目内集成Electron 进入我们项目的根目录,我们执行以下命令来安装插件vue-cli-plugin-electron-builder 代码语言:javascript 复制 vue add vue-cli-plugin-electron-builder 我们选择版
最后在Home.vue中使用我们的FileEdit组件: .sync 这个也是vue 2.3.0+之后新加的一个语法糖,平时在封装组件的时候很好用的一个语法糖,它的实现机制和v-model是一样的。我们可以先看下官方文档:https://cn.vuejs.org/v2/guide/components-custom-events.html#sync-%E4%BF%AE%E9%A5%B0%E7%AC%A6 “在有...
一.环境准备 1.vue版本3.2.13 2.npm版本5.0.3 3.打包工具webpack 二.步骤 1.首先使用 vue create demoproject命令创建项目 2.在项目中使用命令 vue add electron-builder 这一部命令我是在vscode里面执行的,vscode使用的powershell对这个命令有限制,需要 执行set-ExecutionPolicy Unrestricted来允许。这一步,可能比...
进程间的基本使用参见上面的教程【进程间通信】,这里需要介绍的是在electron-vite-vue项目中进程间的通信写法 electron-vite-vue项目packages的目录结构如下(即源码的目录结构) ├── packages | ├── main 主进程源码 | | └── index.ts | | └── vite.config.ts | ├── preload 预加载脚本源码 ...
一、Electron-vue简介 二、安装yarn 三、创建Electron-vue项目 1. 关于 electron-builder 2. 安装脚手架 3. 运行 4. 打包应用程序 四、background.js说明 1. 引入模块和依赖: 2. 注册协议: 3. 创建窗口函数: 4. 生命周期事件和监听器: 五、使用UI库 Vuetify ...
vue 3.3.4vue-router 4.2.5element-plus 2.3.14less 4.2.0sass 1.69.0stylus 0.60.0 ※注: 代码区域每行开头的: "+" 表示新增 "-" 表示删除 "M" 表示修改 1 Electron核心概念 学习Electron最先要掌握的就是他的主进程与渲染进程概念。网上很多相关教程也进行了详细介绍,又是画关系图又是文字描述的。
npm uninstall vue-cli-g 安装 install @vue/cli -g 1.2 使用vue-cli创建项目 选取一个项目存放的路径,然后开始创建项目 例如: vuecreateelectron-vue-helloworld 这里将项目名定为:electron-vue-helloworld 输入完上述命令之后进入vue项目的创建过程。出现以下内容 ...
由于使用的ruoyi-vue框架开发,所以这篇教程以ruoyi-vue为基础的。 环境说明 nodejs:v16.18.1 npm:8.19.2 ruoyi-vue:3.8.6 环境部署 下载若依并安装依赖 ruoyi-vue:https://gitee.com/y_project/RuoYi-Vue # 进入项目目录 cd ruoyi-ui # 安装依赖 强烈建议不要用直接使用 # cnpm 安装,会有各种诡异的 bu...
第一步:全局安装vue脚手架(如果已安装,就不必进行这一步了) 第二步:通过vue脚手架,创建一个vue项目 第三步:进入创建好的vue项目文件,安装electron 第四步:配置package.json文件和main.js文件 第五步:加载vue项目 第六步:运行electron命令,弹出应用框。