博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
将现有vue项目基于electron打包成桌面应用程序
阅读量:5888 次
发布时间:2019-06-19

本文共 756 字,大约阅读时间需要 2 分钟。

一、前言

  项目本来打算采用B/S架构去做的,只是在"人群中多看了你一眼"

二、使用electron集成桌面应用

  本身项目是使用vue-cli开发的,在使用electron之前,需要将本身的项目打包好后打开index.html能显示网页.因为刚接触便直接拿官方demo进行打包了.

  1.克隆官方demo:

  2.cd electron-quick-start->npm install->npm start   到这就能运行demo了

  3.将自己项目打包好的dist文件中的index.html和static文件放入electron-quick-start(跟目录)文件中,重新start一下,运行结果如图

4.在package.json中增加如下代码

"pack":"electron-packager . 'health-terminal' --platform=win32 --arch=x64  --out=./out --asar --app-version=0.0.1"

运行npm run pack 打包成功 

文件结构

 

 

5.在electron中进行网络请求时需注意,因为本身项目使用了反向代理,打包后请求路径前面会增加本地路径“file:e/”,解决方式:

  在config-dev.env.js(测试环境)和pro-env.js(正式环境)添加API_ROOT:'192.168.0.0:8080'(根据自己的需要修改)

新建一个js文件导出process.env.API_ROOT;

 最后在main.js中引用

请求路径前加上this.root

 

至此一个桌面应用已经打包完成

转载于:https://www.cnblogs.com/xufeikko/p/10559444.html

你可能感兴趣的文章
TCP/IP详解学习笔记(8)-DNS域名系统
查看>>
通过维基API实现维基百科查询功能
查看>>
bootstrap 2
查看>>
Annotation研究的一些学习资料
查看>>
webpack资料
查看>>
DotNet加密方式解析--散列加密
查看>>
OpenSSL使用2(SSL,X.509,PEM,DER,CRT,CER,KEY,CSR,P12概念说明)(转)
查看>>
【前端】:HTML
查看>>
SSM框架——使用MyBatis Generator自动创建代码
查看>>
java数据库操作:JDBC的操作
查看>>
35佳以字体为核心的优秀网页设计作品
查看>>
基于OpenCV的形态学开源库 V0.2
查看>>
在ubuntu下安装和配置vsftpd
查看>>
c#中结构体和类的比较
查看>>
Linux磁盘配额
查看>>
JQuery UI的拖拽功能
查看>>
数据驱动销售——个性化推荐引擎
查看>>
C语言标准库函数qsort那点小事
查看>>
HL7 CDA高级培训
查看>>
Android 调用照相机拍照
查看>>