vue2+electron 给大家说个相声

需求:最近项目,需要把后台系统集合为桌面端的应用。

示例:   完成打包并安装后会在桌面呈现为这样的形式,当然图标可以自定义以及自定义安装路径,详情参照官网(反正我看不懂),开个玩笑,看我github库有描述 分享在文章末尾

写作目的:因为在了解过程中还是经历了一些曲折,所以在此分享一下经验和成果希望对大家有些帮助。

问:1.那要实现,用前端的技术栈来完成该需求,需要如何做呢?

答:我使用了一款叫electron适用于混合开发的框架 。

问:2.electron是什么呢?

答:electron是什么?在该连接文章中对electron有详细描述可参考,我结合个人理解对其进行阐述:

  Electron 是一个跨平台的、基于 Web 前端技术的桌面 GUI 应用程序开发框架,可以通过html-js-css的形式以及结合vue、react、来实现桌面端应用地编写使用 Node.js 来通信、处理音频视频等,几乎所有的 Web 前端技术和框架(jQuery、Vue、React、Angular 等)都可以应用。由于内置了Chromium 浏览器,所以您甚至可以不用考虑兼容性问题。

这里提及一下开源框架的开发者:赵成 有兴趣的可以了解一下。

我主要分享的是electron-builder的基础使用(打包工具,将你开发的项目打包为桌面端应用)和electron基本使用,以及vue+electron-builder结合开发

说说vue+electron-builder结合开发(穿插electron知识)

说在前面,你需要了解:electron有两个进程 通俗具体来说 渲染进程控制页面,相对浏览器来讲,渲染进程就是各个网页,也就是应用内容。主进程控制应用窗口,也就是下图部分。

 

接下来开始搭建工程文件

你可能感兴趣的:(electron,javascript,前端,vue)