Vue项目最快最简单打包成桌面应用

最新推荐文章于 2024-08-29 10:36:05 发布
最新推荐文章于 2024-08-29 10:36:05 发布
阅读量1k 收藏 8
点赞数
分类专栏： vue electron 文章标签： vue.js node.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45648000/article/details/113003700
版权
本文介绍了如何将Vue项目快速打包成桌面应用的步骤，包括修改Vue项目的publicPath，使用vue ui打包生成dist文件，从Electron官方获取模版，替换dist文件，以及使用electron-packager进行正式打包，并提供了配置修改的选项。
摘要由CSDN通过智能技术生成

打包vue项目为dist文件

1）修改基础路径（必做）
第一个坑：需要修改静态资源路径为相对路径，找到
vue.config.js文件修改publicPath，此处不修改，打包的dist文件的index.html文件将无法加载出来；

publicPath: process.env.NODE_ENV === 'production' ? './' : './',

2）运行vue ui进行打包

控制台

vue ui

进入vue项目管理界面，进行打包，生成dist文件

最低0.47元/天 解锁文章
小小的产品经理
关注
专栏目录
python+vue的windows桌面应用实现方式
什么都干的派森
01-10 5099
会使用 electron 将 vue 项目打包成 exe【参考文章】会使用 python 的 fastpai 编写服务【参考文章】
利用vue + electron将web项目打包成桌面应用
xiaoshuai_blog的博客
02-13 2857
一、背景 最近公司需要将已经做好的vue项目，打包成桌面应用程序。去网上找了些资料，用的是比较简单的一种。当然了，还有其他的方法，比如说基于electron-vue脚手架。但是当前首要的是出成果，所以就用第一种方法。   二、讲重点 具体的流程，参考：https://blog.csdn.net/m0_37604745/article/details/79303342（也有其他人写的，都是大...
vue后台项目打包成桌面应用程序（.exe）
最新发布
时漂亮的博客
08-29 1167
1、打包成功后的样子。
Vue项目打包为桌面应用
weixin_43764914的博客
09-08 1597
vue项目打包为桌面端
vue项目打包桌面程序
han_xiao_xiao的博客
11-18 978
cnpm run packager 出现问题：13.229.188.59:443 timeout 1.无效（×） npm install chromedriver --chromedriver_cdnurl=http://cdn.npm.taobao.org/dist/chromedriver 有效 set ELECTRON_MIRROR=https://npm.taobao.org/mirrors/electron/ cnpm run packager ...
vue项目打包成electron桌面端exe应用（0-1保姆级教程）
qq_52132550的博客
07-15 3059
vue项目打包成桌面端exe应用（0-1保姆级教程）
Vue+Electron打包桌面应用(从零到一完整教程)
weixin_68658847的博客
07-15 1958
Vue+Electron打包桌面应用(从零到一完整教程)
electron 将pc端（vue）页面打包为桌面端应用
热门推荐
j_bleach的博客
11-12 2万+
背景最近在学习RxJS，平时边看文档边顺手就敲一敲那些API，有时候想回顾一些自己写的东西，就要先把项目跑起来，这也难免有些麻烦。于是乎，就想着把自己写的这个小项目打包成桌面端，方面每次打开电脑就能看。经过网上查阅，比较成熟的解决方案很多，比如electron，nw.js等等。最终选定用electron，因为他的星星最多，哈哈。这个练手Rxjs的小项目是用vue跑的，之前没玩过vue，顺手玩一下。打
Vue 3 桌面应用开发（文末附视频）
sybh的博客
01-13 7422
在正式开始之前，我想先直接“输出”一些背景信息，既能阐明我的观点，也希望可以坚定你学习本小册的决心。首先，桌面应用开发在未来一定会大放异彩，桌面应用相对于移动应用来说优势非常明显（交互区域更大、性能更好、输入输出设备更好），微软、谷歌等大厂都开始重新重视这个领域，并投入了大量人力物力研发基础框架。其次，Electron 等框架把前端工程师进入这个领域的门槛降到足够低，且社区活跃，生态繁荣，优秀产品数不胜数，前端工程师可以从容使用自己熟悉的技能开发出优秀的桌面应用产品。
vue项目打包成桌面应用并修改图标
欢迎来到我的博客！在这里，我将分享我在前端开发方面的知识和经验。让我们一起探索前端开发的无限可能！
05-15 4116
回去看文件夹有可能会多一个副本exe可以删除，看到之前修改的exe文件的图标没有变，其实已经变了，可以选择重新启动电脑打开就会看到变了，或者你心里想这个就是你要的那种，直接打包给别人，别人看到就是修改之后的。html文件实际上不用修改就可以直接使用，但是我用过其他方式打包发现可以修改html文件，以后就不用再打包文件重新生成桌面应用，所以我做了修改。npm run dist //打包项目为 exe 文件。打包给别人是压缩外面那个包给别人，不是直接给exe文件。package.json 内容。
经常忘记网址？将Vue项目一键打包为桌面客户端 十分钟让你解决烦恼
Designer 小郑的技术博客
12-06 4340
本文讲解了如何将一个Vue项目打包为桌面客户端，实现像Excel一样双击运行，适用于管理较多项目且经常忘记网址的场景。本文还讲解了 Vue 项目从下载依赖、打包和Nginx部署的全过程，可以给开发者参考学习。
vue项目打包成.exe桌面应用
月兒~圓
05-30 1597
整理一下本人实现vue项目打包成桌面应用的流程 一、新建文件夹，使用git下载 # gitee git clone https://gitee.com/wallace5303/electron-egg.git # github git clone https://github.com/wallace5303/electron-egg.git 二、进入到electron-egg cd electron-egg-> npm install 三、把你的项目打包成dist文件，生成的dist文件把 el
eletron将vue打包成桌面应用（exe）
weixin_43575792的博客
07-14 1613
1.前期准备 两个项目： 第一个是自己用vue cli创建的项目（内容自行决定）; 第二个是去github将案例下载下来 案例地址 接着测试案例是否可以正常运行 # 进入项目 cd electron-quick-start # 安装依赖库 npm install # 运行应用 npm start 效果图如下 2.运行 首先要在自己的vue cli项目下的package.json 中scripts下添加2行 如下 "scripts": { "serve": "vue-cli-servi
vue项目打包成桌面程序
afggg_的博客
12-12 337
vue桌面程序打包
将vue项目打包为桌面应用程序（electron + vue-cli3）
saber的博客
01-11 1774
打包vue项目为桌面应用程序（vue-cli3+electron）
vue 使用 Electron打包成桌面应用
qq_27717857的博客
07-24 1066
1. cd目录到 npm run build 生成的dist文件夹 2.dist目录下新建package.json、electron.js文件，内容如下： { "name": "FloorGuidance", "version": "1.0.0", "description": "A minimal Electron application", "main&
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值