electron打包vue项目

Python微信订餐小程序课程视频

https://edu.csdn.net/course/detail/36074

Python实战量化交易理财系统

https://edu.csdn.net/course/detail/35475

创建项目

点击这里

添加electron-builder

1、在项目目录下运行命令:vue add electron-builder
2、electron-builder添加完成后会选择electron版本,直接选择最新版:
image

electron下载失败

vue add electron-builder下载electron会下载失败,使用淘宝镜像下载:cnpm i electron
image

窗体运行

1、下载完成后尝试运行electron窗体:npm run electron:serve
image
2、窗体运行成功:
image

打包exe

1、运行打包命令:npm run electron:build
image
2、打包时由于会在github下载包,国内网络一般会失败,需要手动下载nsis与winCodeSign(网络允许的话你也可以自己到github下载,这里我下载分享出来了),点击这里下载,提取码:1uq8,解压后将nsis与winCodeSign复制(替换)到以下目录:
image
3、复制文件后再次运行打包命令即可打包成功:
image
4、打包完成后,项目目录下会多出一个dist_eletron,打包出的exe即在其中,此exe需安装后使用:
image
5、但在dist_eletron的win-unpacked下也会有与项目同名的exe,此exe无需安装即可运行,但依赖同级目录下的文件,不能直接单独使用:
image

白屏

1、到这里其实打包就已经成功完成了,但你打开exe后会发现与在项目中窗体运行不一样,或者直接白屏,这是由于vue与electron路由模式的原因,vue一般默认history模式。
image
2、需要在router的index.js中修改:从vue-router中引入createWebHashHistory,将createWebHistory(process.env.BASE_URL)改为createWebHashHistory(process.env.BASE_URL)。
image
若为vue2的项目则直接将mode的值从history改为hash:
image
3、删除项目中的dist_eletron目录,重新npm run electron:build打包:
image
4、打包成功:
image

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/401250.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Hdu 4293 DP

题意: n个人说自己前面有多少人 后面有多少人 求出说真话人数最多的情况 每个样例有 一个 n 表示n个人 接下来 n 行有a b 表示他前面的人数和后面的人数 思路: 如果已经知道了其中一组的人数~ 就往前找..找在这一组之前与这一组的话不矛盾的最多人数 Ti…

IAR切BANK--程序中的使用

一、在IAR的集成开发环境中实现数据变量定位方法如下三种 1、__no_init char alpha 0x0200; 2、#pragma location 0x0202 const int beta; 3、const int gamma 0x0204 3; 或: 1)__no_init int alpha "MYSEGMENT"; //MYSEGMENT段可在…

你需要知道的vue2 jsx render函数

通常开发vue我们使用的是模板语法,其实还有和react相同的语法,那就是render函数,同样支持jsx语法。 Vue 的模板实际是编译成了 render 函数。 0 传统的createElement方法 createElement(anchored-heading, {props: {level: 1}}, [createEleme…

|与||的区别

在众多编程语言中,|与||代表了不同的运算。其中|是按位或运算,||是逻辑或运算。从字面意思来理解,|常可以用于具体数值的计算,结果为数值,而||是用来逻辑运算的没结果只有False或者True。例如int a 2; int b 3; int …

CSS/CSS3语法新特性笔记

Python微信订餐小程序课程视频 https://edu.csdn.net/course/detail/36074 Python实战量化交易理财系统 https://edu.csdn.net/course/detail/35475 CSS层叠样式表 三大特性 层叠性:相同的样式会覆盖 继承性:属性可向下继承 优先级:范…

vb 坐标点击

引用 :http://www.vbgood.com/thread-113934-1-1.html 第一步在窗体的通用栏写如下代码:Private Type pointapiX As LongY As LongEnd TypePrivate Declare Function GetCursorPos Lib "user32" (lpPoint As pointapi) As Long第二步在窗体上放…

开始写技术博客

2012年年底掏钱参加的java的培训,13年初找JAVA工作,发现很难找,公司需要的都是有工作经验的,刚刚从培训机构出来的学生不受欢迎,工作很难找,一个月之后打算退而求其次,找了份PHP的工作(那时对ph…

C# winform 自定义皮肤制作

最近要做个软件正在做技术准备,由于WINFORM生成的窗体很丑陋,一个好的软件除了功能性很重要外,UI的体验也是不容忽视的。习惯性的在网上搜素了下,换肤控件也有好几款,但是有些用起来不是很好用,好点的也要花…

Vue 源码解读(10)—— 编译器 之 生成渲染函数

Python微信订餐小程序课程视频 https://edu.csdn.net/course/detail/36074 Python实战量化交易理财系统 https://edu.csdn.net/course/detail/35475 前言 这篇文章是 Vue 编译器的最后一部分,前两部分分别是:Vue 源码解读(8)…

蓝牙PROFILE

Bluetooth的一个很重要特性,就是所有的Bluetooth产品都无须实现全部 的Bluetooth规范。为了更容易的保持Bluetooth设备之间的兼容,Bluetooth规范中定义了Profile。Profile定义了设备如何实现一种连接或者应用,你可以把Profile理解为连接层或者…

Laravel Session 遇到的坑

这两天遇到了一个很奇怪的问题,更新session ,session的值不变。经过一番追查,终于找到问题,并搞明白了原理。写这篇博客记录下。 框架版本 Laravel 5.4 问题 先来描述下问题,我在我们项目基础的Middleware中&#xff0…

bootstrap 中这段代码 使bundles 失败

bootstrap 中这段代码 使bundles 失败 _:-ms-fullscreen, :root input[type"date"], _:-ms-fullscreen, :root input[type"time"], _:-ms-fullscreen, :root input[type"datetime-local"], _:-ms-fullscreen, :root input[type"month"…

敏捷结果30天之第十二天:效率角色-你是启动者还是完成者

一.学习1.启动者:善于思考新想法,有太多想法还未开始,喜欢启动一些新事物,但是当事物成型之后就会离开去寻找下一个创新点。2.完成者:喜欢通过从头到尾的做完一件完整的事情来获得成就满足感。知道自己属于那种效率角色…

netty系列之:EventLoop,EventLoopGroup和netty的默认实现

Python微信订餐小程序课程视频 https://edu.csdn.net/course/detail/36074 Python实战量化交易理财系统 https://edu.csdn.net/course/detail/35475 目录* 简介 EventLoopGroup和EventLoopEventLoopGroup在netty中的默认实现EventLoop在netty中的默认实现总结 简介 在net…

BZOJ 1444: [Jsoi2009]有趣的游戏 [AC自动机 高斯消元]

1444: [Jsoi2009]有趣的游戏 题意:每种字母出现概率\(p_i\),有一些长度len的字符串,求他们出现的概率 套路DP的话,\(f[i][j]\) i个字符走到节点j的概率,建出转移矩阵来矩乘几十次可以认为是无穷个字符,就得…

Oracle安装部署之RedHat安装Oracle11g_R2

硬件配置 内存 :≥1G 硬盘空间:≥10G 上传oracle11g安装包: putty上用wcw用户登录,通过ftp服务上传oracle安装文件到/home/wcw目录下解压 #unzip linux_11gR2_database_1of2.zip #unzip linux_11gR2_database_2of2.zip 检查和安装…

Fans没信心,回家继续修行

今天在CSDN上看了一篇的文章,感觉自己实在是太菜了,以至于对毕业之后从事IT行业没有了任何信心。现在也不清楚,自己能否在it行业混下去。自己的技术实在是一个水啊。8号就要回家了,兄弟姐妹们如果有事情,请发短信至 15…

查找字符串中要查找的字符串最后一次出现的位置

C Code 123456789101112131415161718192021222324#include <stdio.h>#include <string.h>//查找字符串中要查找的字符串最后一次出现的位置 char *strrstr (const char*string, const char*str){char *index NULL;char *ret NULL;int i 0;do{index strstr(stri…

基于SqlSugar的数据库访问处理的封装,支持多数据库并使之适应于实际业务开发中

Python微信订餐小程序课程视频 https://edu.csdn.net/course/detail/36074 Python实战量化交易理财系统 https://edu.csdn.net/course/detail/35475 在我的各种开发框架中&#xff0c;数据访问有的基于微软企业库&#xff0c;有的基于EFCore的实体框架&#xff0c;两者各有其…

Unity 实现物体破碎效果(转)

感谢网友分享&#xff0c;原文地址&#xff08;How to Make an Object Shatter Into Smaller Fragments in Unity&#xff09;&#xff0c;中文翻译地址&#xff08;Unity实现物体破碎效果&#xff09; In this tutorial I will show you how to create a simple shattering ef…