【win&mac】30分钟学会Vite创建和打包Electron+Vue3,前端跨平台桌面应用零基础入门教程【2024新版ESM规范】共计6条视频,包括:1.基于 Vite 创建 Vue3 项目、2.安装和配置 Electron、3.兼容 mac等,UP主更多精彩视频,请关注UP账号。
# 安装依赖,这里有个问题,可能ELECTRON或者postcss会由于玄学原因安装失败,此时我推荐使用cnpm安装依赖然后!删除那个node_modules包,重新npm i,这样做的原因是# ELECTRON只要下载了一次您自己没有清除缓存的话,就可以直接使用上次的安装包,这样通过cnpm安装完成之后,一定!要删除一次依赖包!一定哦!# 再使用npm安装就会使...
npm init electron-app@latest my-new-app -- --template=vite 1. Vue3 添加vue依赖 复制 npm install--save vue 1. 修改Vite配置 脚手架生成的Vite配置文件有三个,分别是vite.main.config.mjs、vite.reload.config.mjs和vite.renderer.config.mjs。这里修改vite.renderer.config.mjs如下。 复制 import{define...
\" \"vite\"", 成熟的脚手架 日常开发可以使用 electron-vite (opens new window)或 electron-vite-vue (opens new window)、 electron-react-boilerplate (opens new window)等脚手架快速创建项目,脚手架已经为我们完成了基本的配置,并支持使用 Vue与React等技术开发Electron项目。 __EOF__ 本文作者: Jia...
Vite2.3:Vite是一种基于ESM的现代化前端构建工具,它使用原生ESM提供极速的更新和启动速度。我们选择Vite2.3作为项目的构建工具,因为它具有快速、灵活和可扩展的特点。 Electron13:Electron是一种使用Web技术(HTML、CSS和JavaScript)构建跨平台桌面应用的框架。我们选择Electron13作为项目的跨端框架,因为它可以让我们使用熟悉...
Electron 需要单独的main.js 和 index.html 来启动桌面程序, 其中包括构建好的Vue工程。 构建我们的Vue3 应用程序 由于我们的Vite 加 Vue3 项目,使用了一些其他技术,所以我们在部署Web 应用的时候需要先构建。 在Electron 项目中,也是同样的道理,我们需要先构建我们的Vue3 + vite 的项目。
21:45 对于Electron-Vite 这个项目,嘉宾想澄清一些事情,项目发展和社区认可、官方集成。参与开源希望做更优质、透明的工作。25:00 从这件事情说开去,先谈参与开源的感受和想法。26:30 我们提到的 Forge 到底是什么,和 Electron Builder 是什么关系?和 Electron-Vite 是什么关系?背后的故事31:55 谈及Forge 和 ...
21:45 对于 Electron-Vite 这个项目,嘉宾想澄清一些事情,项目发展和社区认可、官方集成。参与开源希望做更优质、透明的工作。 25:00 从这件事情说开去,先谈参与开源的感受和想法。 26:30 我们提到的 Forge 到底是什么,和 Electron Builder 是什么关系?和 Electron-Vite 是什么关系?背后的故事 31:55 谈及 Forge...
vite+vue3+electron桌面端开发 ps :踩坑踩了一个多小时 如果嫌麻烦可以直接拿走用 克隆代码仓库 1.https://gitee.com/dmhsq/vue3-vite-electron https://gitee.com/dmhsq/vue3-vite-electron.git 2.https://github.com/promiseHusky/vue3-vite-electron ...
// https://vitejs.dev/config/ export default defineConfig({ base: "./", // 新增 plugins: [vue()] }) ``` ### 3. 同时开启vite和electron服务 为了使vite和electron正常运行,需要先运行vite,使得其开发服务器的url可以正常访问,然后再开启electron去加载url。 此处需要安装两个库: * **concurrently...