vue项目打包成b端桌面应用，electron

最新推荐文章于 2024-11-03 19:51:25 发布
最新推荐文章于 2024-11-03 19:51:25 发布
阅读量258 收藏 1
点赞数
文章标签： vue.js electron 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/vue6214/article/details/128057930
版权
本文指导如何将React项目与Electron结合，通过npm run build打包React应用，然后将dist文件放入Electron项目中，修改main.js加载dist/index.html。接着安装指定版本的Electron和electron-packager，运行npm run packager生成exe可执行文件。注意解决可能出现的依赖版本问题。
摘要由CSDN通过智能技术生成

1.下载官网electron项目地址

git地址： git clone https://github.com/electron/electron-quick-start

2.将自己的项目npm run build打包

3.将dist文件放到electron项目一级目录下

4.找到main.js，设置：

mainWindow.loadFile('./dist/index.html')

5.npm run install，npm run serve

6.npm run packager 打成exe

注：如果报错请下载固定版本

    "electron": "^19.0.8",

    "electron-packager": "^15.5.1"

一个金牛座的前端
关注
前端+将vue项目打包为桌面应用+electron学习
04-15
内容概要:Electron是一个开源的框架，用于构建跨平台的桌面应用程序。它是由GitHub开发的，最初是为了构建...使用人群:学习Electron,将vue项目打包为桌面应用 内容关键词:vue,Electron 用途:将vue项目打包为桌面应用
独立开发者工具：electron-egg桌面软件开发框架
qq_32660241的博客
09-27 1425
独立开发者工具：electron-egg桌面软件开发框架
vben:vue3后台管理项目框架
浩星
02-28 3万+
前言： Vue-Vben-Admin是一个基于Vue3.0、Vite、Ant-Design-Vue、TypeScript的后台解决方案，目标是为开发中大型项目提供开箱即用的解决方案。包括二次封装组件、utils、hooks、动态菜单、权限校验、按钮级别权限控制等功能。项目会使用前端较新的技术栈，可以作为项目的启动模版，以帮助你快速搭建企业级中后台产品原型。也可以作为一个示例，用于学习vue3、vite、ts等主流技术。该项目会持续跟进最新技术，并将其应用在项目中。 官方入口：...
Web项目转换为Electron桌面应用程序
yuesongblog的专栏
03-13 951
确保你已经在系统中安装了Node.js和npm（Node.js包管理器）。在VS Code中选择一个合适的文件夹，并在其中创建一个新的文件夹来存放你的Electron项目。这将启动Electron应用程序，并在Electron窗口中显示你在。在Electron项目中创建一个electron-builder。将打包后的文件拷贝到Electron项目文件夹的dist下。在项目文件夹中创建一个Electron的入口文件，例如。这将在你的项目中安装Electron并将其添加到。在Electron项目中创建一个。
vue项目打包成electron桌面软件 ---踩坑日记
biubiubiuPlus的博客
03-16 2616
如果你可以建一个网站，你就可以建一个桌面应用程序。 Electron 是一个使用 JavaScript, HTML 和 CSS 等 Web 技术创建原生程序的框架，它负责比较难搞的部分，你只需把精力放在你的应用的核心上即可。 官网地址 注：vue的新老项目都可打包成electron桌面软件，我这里是新建的新项目 1.搭环境 //安装淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org //安装脚手架 npm install @
2021年九款最佳VUE3 UI框架推荐
u011269322的博客
08-24 2773
2021年九款vue3 UI框架1. Ant Design Vue2. BalmUI3. Wave UI4. Vuestic5. Element+6. Ionic7. Naive UI8. Quasar9. PrimeVUE 注：排名不分先后 注：文章来源于公众号《前端新世界》 1. Ant Design Vue 官方网站：http://2x.antdv.com/components/overview/ Ant Design Vue 是一个非常成熟的框架，使用 Ant Design Vue 创建用户界面非常
electron+vue3实现桌面端应用开发
08-18
此外，可能还涵盖了如何打包和发布Electron应用，以及如何处理Electron与Vue3之间的通信。 总的来说，这个主题涵盖了前端开发的多个重要方面，包括现代Web框架、快速的开发工具以及桌面应用的构建。对于想要涉足...
Vue项目使用electron打包成.exe文件
08-22
Vue 项目与 Electron 结合可以创建桌面应用程序，而 Electron 是一个开源框架，允许开发者使用 JavaScript、HTML 和 CSS 创建跨平台的桌面应用。 首先，确保你的开发环境满足以下要求： 1. Node.js 版本：Electron ...
vue项目打包exe,需要用到的electron项目
06-14
2. **Electron-Builder**：为了将Vue项目打包成EXE，你需要引入Electron并使用Electron-Builder这样的打包工具。Electron-Builder能处理构建、打包、签名等步骤，支持生成Windows、MacOS和Linux的可执行文件。 3. *...
vue项目打包为桌面应用.doc
03-20
本文档将详细介绍如何利用Vue.js结合Electron将一个Web项目打包成桌面应用的过程。 #### 一、安装必要的依赖工具 在开始之前，首先确保已经全局安装了以下工具： 1. **Electron**: 用于构建跨平台的桌面应用的核心...
【electron】 vite + electron-builder 打包配置
军火库
09-21 2892
整理了一套《前端大厂面试宝典》，包含了HTML、CSS、JavaScript、HTTP、TCP协议、浏览器、VUE、React、数据结构和算法，一共201道面试题，并对每个问题作出了回答和解析。有需要的小伙伴，可以点击文末卡片领取这份文档，无偿分享部分文档展示：文章篇幅有限，后面的内容就不一一展示了有需要的小伙伴，可以点下方卡片免费领取。
开箱即用，这些 Vue3 后台管理系统模板绝对让你爽歪歪！
热门推荐
唐先森的博客
09-02 5万+
之前写了一篇关于 Vue2 的后台管理系统模板的推荐，详情请见。Vue3 在今年2月份已成为新的默认版本，本文收集了一些 Vue3 的后台管理系统模板，分享给在座的仌 👣。还是老规矩，按照星标数量来依次介绍。
【Eelectron入门系列】（三）Electron+Vue 开发桌面程序
江小举的博客
04-26 692
原创不易，未经允许，请勿转载。 博客主页：https://xiaojujiang.blog.csdn.net/ 如何用vue单文件组件来开发electron程序呢？这里一共需要用到两个工具 vue-cli：vue的脚手架，用于创建vue项目 vue-cli-plugin-electron-builder 在开始之前，电脑请先准备好node.js和npm环境 安装vue-cli，并且创建一个vue项目 首先安装一下vue-cli npm install -g @vue/cli 安装好后创建一个vue.
2022 年最新前端 Vue 项目重构总结
我本可以容忍阳光，如果我不曾见过太阳，然而阳光已使我荒凉，成为更新的荒凉。
01-27 1077
点击上方前端瓶子君，关注公众号回复算法，加入前端编程面试算法每日一题群本文主要内容对于老旧的项目，升级webpack的时我的操作步骤。基于项目的产品定位和业务发展走势，在重构时我可以从哪...
基于SSM+VUE历史车轮网站JAVA|VUE|Springboot计算机毕业设计源代码+数据库+LW文档+开题报告+答辩稿+部署教+代码讲解
卓越软件开发的博客
11-01 775
源代码+数据库+LW文档（1万字以上）+开题报告+答辩稿部署教程+代码讲解+代码时间修改教程。
vue-i18n国际化多国语言i18n国际语言代码对照表
aming小老弟
10-31 475
uniapp是自带有i18n这个插件需要自己去给每一个需要国际化的字符去手动配置key，所以如果是已经完成的项目可能工作量就稍微有点大了第一步：语言命名是有规范的不能乱取名，具体可以参考国际语言代码i18n国际语言代码对照表zh_CN 中文(简体) 中国zh_TW 中文(繁体) 中国台湾pt_PT 葡萄牙语 葡萄牙ja_J...
Vue.js 构建可复用的组件
Davina_yu的博客
10-31 429
通过以上步骤，创建了一个可复用的按钮组件，并在主应用中注册和使用了它。这样的组件可以很容易地在不同的场景下重复使用，只需传递不同的属性即可定制其外观和行为。这对于构建大型的、复杂的前端应用是非常有用的。
【660】基于SSM+Vue的在线学习系统设计与实现
最新发布
paopaokaka_luck的博客
11-03 504
IDEA的诞生在Java集成开发工具行业正所谓平地起雷，瞬间震动了整个Java开发行业。真的是每个人用过的都说好。IDEA之所以相比于其他比如MyEclipse或者Eclipse之类的Java开发工具来讲比较好，原因首先在于设计方面。IDEA采用了所谓的人体工程学设计原理，让使用IDEA的人员用了就忘记不了。软件打开首先要设置主题，可以选择常规的白色或者暗色系列，长时间的白色或者长时间的暗色会让开发人员的眼睛疲劳加重，首先从这个细节就让程序开发人员备受青睐，让程序员看着舒服；
Maven+Jsp+Vue的文视界创作平台
战族狼魂的博客
11-03 79
主要擅长SpringBoot、Vue、SSM、HLMT、Jsp、Nodejs、Python、爬虫、数据可视化、小程序、物联网、前端、数据库等设计与开发；功能设计、功能实现、代码编写、代码调试运行、协助代码逻辑理解、调试过程中问题解决；
Vue项目打包成exe的Electron应用指南
Vue项目负责前端界面和功能的实现，而Electron项目则提供将Vue项目打包成桌面应用程序的能力。 打包过程大致可以分为以下几个步骤： 1. 创建Vue项目：首先，使用Vue CLI创建一个新的Vue项目。Vue CLI是官方提供的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值