要使用Electron-Vue,首先需要掌握以下几个步骤:1、安装和配置Electron-Vue项目,2、构建和运行项目,3、开发和调试应用。 一、安装和配置Electron-Vue项目 要开始使用Electron-Vue,我们首先需要安装和配置一个新的项目。以下是详细的步骤: 安装Vue CLI: npm install -g @vue/cli Vue CLI是一个功能强大的命令行工具...
electron_mirror=https://registry.npmmirror.com/-/binary/electron/:这个配置项指定了 Electron 包的镜像源,用于下载 Electron 框架相关的二进制文件 安装electron相关插件 接下来就可以进行安装electron和它相关的插件了 // 进入到项目中安装 electron npm install -D electron 安装electron-builder用于打包可安装exe程...
步骤一:创建一个新的Electron项目。可以使用Electron提供的脚手架工具来快速创建一个基础的Electron项目。 步骤二:将Vue项目的代码复制到Electron项目的文件夹中。将Vue项目的所有文件,包括HTML、CSS、JavaScript和其他静态资源,复制到Electron项目的文件夹中。 步骤三:在Electron的主进程中加载Vue项目。在Electron的主进程...
背景: Vue+ElementUI的web项目中, 可以配置一个config.js来解决,那么eletron呢? 思路有两个: 1. 直接使用 global.sharedObject 让main线程与render线程直接数据共享。 2. 借助事件传递。 项目根路径直接放置一个配置文件,可以是config.json 或者 config.yml,都有对应的处理方案,这里以config.yaml做例子: 注意:使...
最近的项目迭代中新增一个需求,需要在electron-vue 项目打包之后,启动exe 可执行程序的时候,动态获取配置文件中的 baseUrl 作为服务端的地址。electron 可以使用 node 的 fs 模块来读取配置文件,但是在项目打包之后项目的静态资源都会被编译成其他文件,本文来记录下相关实现和知识点。
比较合适的一篇文章,在现有的vue项目 追加 electron。 基于上述方法,首次本地运行效果: 解决跨域问题后, Github项目:单独打包的项目 https://github.com/electron/electron-quick-start 新手可以直接用这个项目来进行打包,和原来的项目分享。例如我调整后的: ...
1.配置Vue项目: 1)配置base路径 // vite.config.ts export default defineConfig({ plugins: [vue(), vueJsx()], resolve: { alias: { "@": fileURLToPath(new URL("./src", import.meta.url)), }, }, base: "./", // 新增配置(解决绝对路径导致HTML请求文件失败的问题) }); ...
下载LTS版,安装完成后,打开cmd输入node -v,会弹出node.js版本(安装成功) image 第二步:安装vue-cli 如果电脑里没有安装vue-cli,全局安装: npm install -g vue-cli 第三步:安装electron-vue模板 vue init simulatedgreg/electron-vue my-project my-project:项目文件夹路径 ...
1.2、vue cli + vue-cli-plugin-electron-builder安装方法 1.1.1、创建vue项目 vue create electron-demo 1.1.2、安装vue-cli-plugin-electron-builde插件 vue add vue-cli-plugin-electron-builde 2、窗口配置 例如登录窗口config.ts login: { url: `${baseUrl}#/login`, ...