前言 Electron作为一款跨平台的桌面应用端解决方案已经风靡全球.作为开发者,我们几乎不用关心与操作系统的交互,直接通过Web前端技术与Electron提供的API就可以完成桌面应用端的开发. 然而,为什么国内使用Electron的踩坑文章数不胜数,主要原因是Electron为了支持跨平台,为不同的操作系统平台进行了适配,将chromium内核与node集成到了一起,屏蔽了底层操作系统的细节,所以在不同的平台上有着不同的二进制基座.在开发的过程中,我们必须要下载对应的平台的基座,才能正常开发

Electron: 使用 JavaScript, HTML 和 CSS 等 Web 技术创建原生程序的框架 Vue.js: Web 前端用于构建用户界面的渐进式框架 Vuetify: Vue.js 的 Material Design 组件框架 看完以上介绍,也明白了本文要做的事:用 Vue.js 与 Vuetify 组件,基于 Electron 来创建原生桌面应用. 环境准备 Visual Studio Code Node.js Yarn Vue CLI 创建 Vue.js 应用 添加 Vuet

不要让自己的上限成为你的底线 前言 诈尸更新系列,为了跟上脚步,尝试了vue3,在学习vue3的时候顺便学习一手electron和ts,本教程将分别发布,源码会在最后的文章发布.因为还在开发中,目前也是为了防止有些遇到坑不会及时忘掉,所以先整理一部分出来 将分2部分发出教程,因为配置的东西个人感觉有点多并且跟开发内容相关的东西并不是很多,因此单独发出,见谅,第二篇这两天发出,长文警告!. 开发思路: 页面: 列表页index.vue 头部.搜索.内容部分,只能有一个列表页存在 设置页settin

目录 结合React+TypeScript进行Electron开发 1. electron基本简介 为什么选择electron? 2. 快速上手 2.1 安装React(template为ts) 2.2 快速配置React 2.3 安装electron 2.4 配置main.js.preload.js和package.json文件 2.5 运行electron项目 2.6 打包项目 3. 自动刷新页面 4. 主进程和渲染进程 5.定义原生菜单.顶部菜单 5.1 自定义菜单 5.2 给菜单定义点击

起因 使用Quasar框架开发Electron软件,配置好后发现electron没有正常安装,但是yarn却一本正经的胡说八道:不不不,electron已经在那里了.打开模块安装目录一看还真有electron文件夹,但是里面核心文件却没有下载. 解决如下: 源的速度过慢 yarn设置临时镜像 yarn save express --registry https://registry.npm.taobao.org yarn设置永久镜像 yarn config set registry https:

使用 electron 做个播放器 本文同步更新在:https://github.com/whxaxes/blog/issues/8 前言 虽然 electron 已经出来好长时间了,但是最近才玩了一下,写篇博文记录一下,以便日后回顾. electron 的入门可以说是相当简单,官方提供了一个 quick start,很流畅的就可以跑起来一个应用.因此,如何入门就不赘述了,直接说一下如何做个播放器. 为啥要做个播放器呢,因为我在很久很久以前写过一个网页版的音频可视化播放器,但是因为是在页端,所以

github地址 本地安装环境准备 安装node: * https://nodejs.org/en/download/ 配置webpack: npm install -g webpack(sudo权限) windows配置cnpm: npm install -g cnpm --registry=https://registry.npm.taobao.org 因为npm的默认仓库在国外,下载很慢,国内淘宝搞了个CNPM,每10分钟同步一次,完全够用了 当然也可以使用yarn下载 npm insta

前言 Electron 是一个搭建跨平台桌面应用的框架,仅仅使用 JavaScript.HTML 以及 CSS,即可快速而容易地搭建一个原生应用.这对于想要涉及其他领域的开发者来说是一个非常大的福利. 原文作者:林鑫,作者博客:http://blog.gdfengshuo.com/ 项目介绍 仓库地址:lin-xin/calculator 我这里通过 Electron 实现了仿 iPhone 的计算器,通过菜单可以切换横屏和竖屏,横屏有更多的运算.而对于 JavaScript 进行浮点数计算来说

最近一段时间在用electron+vue做内部项目的一键构建发布系统的桌面应用,现就其中打包流程写个备注,以示记录. Windows环境打包:1.首先贴一下package.json. { "name": "******",//隐藏项目名 "version": "**.**.**",//隐藏版本号 "author": "*** <***>",//隐藏作者信息 "des

 前言 Electron是由Github开发,用HTML,CSS和JavaScript来构建跨平台桌面应用程序的一个开源库. Electron通过将Chromium和Node.js合并到同一个运行时环境中,并将其打包为Mac,Windows和Linux系统下的应用来实现这一目的. Electron于2013年作为构建Github上可编程的文本编辑器Atom的框架而被开发出来.这两个项目在2014春季开源. 目前它已成为开源开发者.初创企业和老牌公司常用的开发工具. 看看谁在使用Electron

ant-design-pro ----> version :2.3.1 由于网上Ant Design Pro+Electron的资料太少,我就贡献一点经验   最近需要讲AntD Pro项目(以下简称Adp)打包成桌面安装使用,因为我的项目是一个企业业务计算系统,并不会常有需求的更新,因此打包成桌面应用,用户体验更好. 首先,Adp项目和Electron打包分开,就是不要把两者的依赖和配置文件放在一个项目里,这是保持项目的纯粹性,各自专注自己的事情.因此,我们就需要一个Adp项目,一个Elect

桌面应用之electron开发与转换 一,介绍与需求 1.1,介绍 1. Electron简介 Electron是用HTML,CSS和JavaScript来构建跨平台桌面应用程序的一个开源库. Electron通过将Chromium和Node.js合并到同一个运行时环境中,并将其打包为Mac,Windows和Linux系统下的应用来实现这一目的.目前,Electron已被Microsoft.Facebook.Slack和 Docker等大厂接受,应用涉及开发工具.社交应用.音乐.游戏.金融等领域

相信很多同学都知道 Electron 可以帮助开发人员使用前端技术开发桌面客户端应用,今天介绍的 electron-vue 框架是一套基于 Vue.js 开发 Electron 桌面应用的脚手架,该项目的目的,是为了要避免使用 vue 手动建立起 electron 应用程序. 您可能感兴趣的相关文章 网站开发中很有用的 jQuery 效果[附源码] 分享35个让人惊讶的 CSS3 动画效果演示 十分惊艳的8个 HTML5 & JavaScript 特效 Web 开发中很实用的10个效果[源码下载

首先是最新版本的树莓派镜像默认不开启ssh,所以烧写好系统之后没法ssh登录 解决方法就是在烧写的内存卡分区内建立一个ssh文件(无后缀名),这样启动的时候就有ssh服务了 在~/.bashrc里面添加一个,alias ll='ls -a -l --color=auto',这样树莓派就支持ll命令了,这个是我个人喜好 然后更换源,这边用浙大的源,系统版本是jessie deb http://mirrors.zju.edu.cn/raspbian/raspbian/ jessie main con

yarn create react-app electron-react cd electron-react yarn run eject // 修改react-app打包的路径 / -> ./ vi main.js main.js const { app, BrowserWindow, ipcMain } = require('electron') const path = require('path') const url = require('url') //保留窗口对象的全局引用,如果不

安装yarn npm i -g yarn yarn yarn config set registry https://registry.npm.taobao.org --global yarn config set disturl https://npm.taobao.org/dist --global yarn config set sass_binary_site https://npm.taobao.org/mirrors/node-sass --global yarn config se

Visual Studio Code调试electron主进程 作者: jekkay 分类: electron 发布时间: 2017-06-11 14:56  一·概述 此文原出自[水滴石]: http://www.easysb.cn 对于窗口中的javascript脚本,我们可以通过谷歌浏览器的很多插件来调试,比如DevTools等.但是对于Electron中的主程序,我们需要额外的工具和方法来进行调试. 对于Electron程序,可以通过以下的命令启动程序,以方便外部调试工具通过V8调试协议

因为信奉一句话:JavaScript 终将一统天下,所以要想方设法开疆扩土. 今天介绍的这个electron就是一大神器,可以很方便的将网页应用打包为Mac, Win, Linux下的可执行文件,只需进行简单的配置,虽比不上原生的速度和瘦小,但是性价比着实不错. 一 在package.json中指明对应版本,(electron和electron-builder需放在devDependencies中),使用yarn添加模块 { "name": "electron_example

我的electron教程系列 electron教程(一): electron的安装和项目的创建 electron教程(二): http服务器, ws服务器, 进程管理 electron教程(三): 使用ffi-napi引入C++的dll   引言   这一篇将介绍如何在node.js+electron环境中, 使用node-ffi/ffi-napi调用C/C++编写的动态链接库(即dll), 实现调用C/C++代码. 本教程适用于electron 4.x-6.x版本. 如electron 4.2

我的electron教程系列 electron教程(一): electron的安装和项目的创建 electron教程(二): http服务器, ws服务器, 进程管理 electron教程(三): 使用ffi-napi引入C++的dll   一. 安装 1.安装node.js 从node.js官网下载 推荐下载LTS版本(当前为10.16.3), 默认安装即可.   2.安装yarn 以管理员模式启动cmd, 执行指令: npm install yarn -g 根据官网介绍, Yarn 对你的代

我的electron教程系列 electron教程(一): electron的安装和项目的创建 electron教程(二): http服务器, ws服务器, 进程管理 electron教程(三): 使用ffi-napi引入C++的dll   引言   这次, 我们一起通过几个例子, 进一步了解node.js+electron.   三个例子:   搭建一个http服务器, 通过web对服务器进行访问 搭建一个ws服务器, 通过web向服务器发送消息 进程管理, 打开/关闭一个外部进程   例子1