1.首先使用 vue create demoproject命令创建项目 2.在项目中使用命令 vue add electron-builder 这一部命令我是在vscode里面执行的,vscode使用的powershell对这个命令有限制,需要 执行set-ExecutionPolicy Unrestricted来允许。这一步,可能比较慢,建议更改npm源为国内镜像 3.执行npm install 三.使用vue来开发页面 1.确...
//查看node版本node-v//查看vue 注意:V大写vue-V//查看electronelectron-v cmd结果 安装Vue Cli 安装 淘宝镜像 cnpm 搭建vue 环境 1、首先使用 vue-cli 搭建基础 vue框架 vue create electron-demo 创建vue框架 运行此命令报错 vueaddelectron-builder 使用下面的命令 cnpm intsall 进行安装 cnpm intsall 安装 完...
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 复制...
结合 Vue 和 Electron 开发桌面端应用程序是一个非常强大的解决方案，尤其是对于已经熟悉 Web 开发的前端工程师来说，利用现有的 Web 技术栈即可构建跨平台的桌面应用程序。通过 Vue 的组件化、双向绑定等特性，以及 Electron 提供的与操作系统交互的能力，开发者可以快速构建现代化的桌面应用。通过合理使用主进程和渲...
0. 开发准备 安装好 vscode 、npm / yarn,安装方法见百度。 1. Electron-vue 安装 # 如果没有 vue-cli 的话需要全局安装 npm install -g vue-cli # 然后使用 vue-cli 来安装 electron-vue 的模板 vue init
无论是从零开始开发新项目,还是将 Vue.js 整合到现有项目中,都能够享受到 Vue.js 带来的便利和优势。 1.2 Electron 概述 Electron 是一个开源框架,用于构建跨平台的桌面应用程序。它由 GitHub 开发,并且基于 Node.js 和 Chromium 构建。Electron 允许开发者使用 Web 技术(HTML、CSS 和 JavaScript)来创建桌面程序...
cd tasky-vue vue add electron-builder 过程中会提示你选择Electron的版本,选择最新版本即可。 在这个过程中,由于网络的原因,Electron可能会安装失败,这时候如果node_modules文件夹中已经有electron文件夹(该文件夹是不完整的electron包,不能运行),那么删除这个文件夹,然后可以使用cnpm重新安装electron。
最后在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 ...
Electron是一个基于Chromium和 Node.js,使用 HTML、CSS和JavaScript来构建跨平台应用的跨平台开发框架,兼容 Mac、Windows 和 Linux。目前,Electron已经创建了包括VScode和Atom在内的大量应用。 环境搭建 创建Electron跨平台应用之前,需要先安装一些常用的工具,如Node、vue和Electron等。