使用electron-builder开发桌面应用程序

首先安装vue脚手架 npm i @vue/cli -g ,然后使用vue create创建项目:vue create monitor 进入 monitor 目录,通过 npm install 构建项目。然后导入electron-builder:vue add electron-builder,最后使用 npm run  [commond] 测试或打包项目。步骤如下:



命令描述:

npm i @vue/cli -g           //安装@vue/cli工具

vue create [项目名称]       //创建vue项目并根据需要选择对应的组件

npm install                      //构建项目,将所有需要的组件导入项目

npm run electron:serve   //运行开发服务器,测试期间使用

npm run electron:build   //将项目打包为.exe后缀的可执行安装文件

 

效果图

1.执行 npm run electron:serve 效果图

2.执行 npm run electron:build 效果图,如果执行成功如图1,会在项目根目录创建dist_electrton文件夹,内容如图2

 

可能遇到的问题

1. TypeError: loaderContext.getOptions is not a function

解决:

(1) vue-cli 降到4.x版本 ,

(2)  ts-loader使用8.2.0版本

npm i -D ts-loader@~8.2.0

 

posted @   七月的枫丶  阅读(241)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· DeepSeek “源神”启动!「GitHub 热点速览」
· 微软正式发布.NET 10 Preview 1:开启下一代开发框架新篇章
· C# 集成 DeepSeek 模型实现 AI 私有化(本地部署与 API 调用教程)
· DeepSeek R1 简明指南:架构、训练、本地部署及硬件要求
· NetPad:一个.NET开源、跨平台的C#编辑器
点击右上角即可分享
微信分享提示