从零开始使用Electron + jQuery开发桌面应用Electron介绍现如今,用 HTML、JavaScript、CSS、Node.js 写桌面应用早已不是什么新鲜的事了,作为一名前端,能够使用自己熟悉的语言,快速实现自己想要的桌面应用,是件很让人兴奋的事。目前常见的有 NW、heX、Electron。今天,就来简单的上手一下 ElectronElectron 是什么?Electron
本文主要分两个部分,分别是在electron中调用jquery和bootstrap的方法以及为什么要这么调用,以及对jquery一些用法的总结。electron中调用jquery及bootstrap的方法jquery作为一个js库,能够很大程度上的简化对页面中元素的控制。而bootstrap作为css库,能够方便的写出好看的界面。调用bootstrap需要先调用jquery。在调用bootstra
转载 9月前
198阅读
一、electron启动后的进程主进程GUP渲染进程界面渲染进程各个进程相互独立,彼此进程是不会共享内存和状态的。1、主进程electron项目启动的时候运行background.js的进程就是主进程,一个项目有且只有一个主进程 创建窗口等有关系统事件写在主进程中进行。它主要通过Node.js、Electron提供的API与系统底层打交道相关apiapp:控制应用的事件生命周期 autoUpdat
一番码客 : 挖掘你关心的亮点。 文章目录前言electron的地位electron中js通过web socket与python通信效果图参考一番今日 前言今天该务实了。上一篇eletron的文章一番学习了用js去调用python。今天继续这个话题。electron的地位如果我们在网上搜索electron相关的文章,发现很少。原因其实electron只是提供了一个运行js的框架,基本不用开发。el
一、使用预加载脚本1.为了演示这一概念,你将会创建一个将应用中的 Chrome、Node、Electron 版本号暴露至渲染器的预加载脚本;新建一个 preload.js 文件。该脚本通过 versions 这一全局变量,将 Electron 的 process.versions 对象暴露给渲染器。const { contextBridg
开发环境macOS 开发环境配置Winodws开发环境配置Linux开发环境配置编辑器END macOS 开发环境配置Electron支持 macOS 10.10 (Yosemite) 及以上版本安装最新版本的Node.js 。访问Node.js下载页面下载页面选择 macOS Installer 。下载完成后, 执行安装程序,根据引导完成安装即可。安装完成后,我们需要来确认Node.js是不是
前言早期跨平台桌面应用开发大多采用 Qt 和 C++,受语言学习成本开发效率影响,越来越多的人将目光转向了 ElectronElectron 是以 Nodejs 和 Chromium 为内核的跨平台开发框架。Electron 基于 Web 技术开发桌面应用,Web 技术在软件开发领域应用非常广泛,生态较为成熟,学习成本较低、开发效率高。但是 Web 在处理多线程、并发场景时显得捉襟见肘,Elec
.近年来 web 应用变得越来越强大,但是桌面应用仍然有充分利用硬件的优势。今天,我们可以通过我们熟悉的 HTML、JS 和 Node.js 来创建桌面应用,打包成一个可执行文件,并且发布在 Windows, OS X 和 Linux 上。有两个受欢迎的开源项目,能够帮助我们实现这个目的。一个是几个月前我们讨论到的 NW.js,另一个是今天我们将要使用的 Electron(点击这里查看它们的不同之
转载 3月前
107阅读
我们通过Electron框架开发客户端,在打包应用程序时通过electron-builder插件来打包应用程序会相对简单。1、首先通过npm install electron-builder --save下载该插件2、下载完成后在跟目录新建electron-builder.json配置文件,下面介绍配置项,首先productName为应用程序的名称directories参数中的output问应用程
最近,把团队内经常使用的一个基于Node.js制作的小工具给做成了可视化操作的桌面软件,使用的是electron,这里简单分享一下使用electron的一些经验和心得。一、如何使用electron把基本的开发环境给跑起来? 然后把相关资源给弄下来,如果你是下载Zip包解压的,则资源默认都会放在一个名为“electron-quick-start-master”的文件夹中,把“electro
vue项目打包成exe可执行文件在学习的过程中,发现关于 Electron ,常见的有两种打包方法:将自己的 vue 项目打包,放到官方的 demo 文件中,改变打包路径在自己的 vue 的项目中引入插件,然后打包 经过一番尝试,我决定采用第一种,原因是:特!别!简!单!下面详细介绍下第一种方法:打包成exe可执行文件1、把electron的官方例子扒下来,下面简称A,留着待用:git clone
**Electron** 是一个使用 JavaScript、HTML 和 CSS 构建桌面应用程序的框架。 嵌入 `Chromium` 和 `Node.js` 到 二进制的 `Electron` 允许您保持一个 `JavaScript` 代码代码库,支持跨平台,一套代码可同时打包为Windows、macOS、Linux应用。 而 **Post-Tool** 就是基于
转载 8月前
130阅读
Electron+Vue构建单体项目Electron:使用JS、HTML和CSS搭建跨平台的桌面应用程序的工具。核心就是跨平台和前端技术,不需要后台(java、php等技术)。        Electron实现这个的基础是它集成了一个浏览器内核,不需要依赖于客户端的其它应用,直接和客户端的CPU、操作系统相关联。就是说它提供了一套适配于
当你使用Weex、ReactNative、Hubuilder构建手机App的时候,你可曾想过桌面应用也应该有一种这样类似Hybrid的方式,让开发者更好的构建桌面应用。 Electron就是使用JavaScript、HTML、CSS等Web技术构建原生程序的框架,Electron是基于Chromium和NodeJS(NodeJS应该是世界上最好的语言),项目完成后封装成一个可以单独运行的Node
最近一直在做Electron的项目,随着项目的上线,在此做一点总结。本文主要记录一些坑点,整个Electron的搭建流程有很多文章说的非常好了,就不赘述了。主要包括关于主进程和渲染进程通信的痛点持久化数据的方案选型打包后文件目录的访问权限关于主进程和渲染进程通信的痛点先看一下官方的说明Electron为主进程( main process)和渲染器进程(renderer processes)通信提供
Electron一、安装electron1、全局安装 npm install -g electron // 安装 electron . // //启动命令 2.单独文件内安装 npm install electron --save-dev //安装 ./node_modules/.bin/electron //启动命令二、创建主窗口创建’main.js‘文件var electron
    跨平台开发一般是Java(基于java虚拟机,一次编译到处运行)和Qt【以及qt的竞品:GTK+之类其它/Qt的商业版是需要收费的,免费版需要开源设计源码,存在版权问题】(基于兼容的开发框架,使用适用于不同平台的编译器(比如MinGW,可以将linux源码程序编译在windows下运行)针对各个平台单独编译达到跨平台效果),还有一种方案就是基于html/js利
JS代码的调试由于Chromium的多进程结构,所以JS代码运行在两种不同的进程环境下,对应的调试方式也分为两种渲染进程下的JS代码调试这个相对简单,我们用代码打开Chromium的开发者工具即可愉快的调试了,代码如下:let win = new BrowserWindow() win.webContents.openDevTools()主进程下的JS代码调试这部分相对麻烦些,按下面的步骤来执行:
相关网址版本对比表Electron版本NODE_MODULE_VERSIONNode版本v3.1.1364v10.2.0v4.2.1169v10.11.0v5.0.1170v12.0.0v6.0.1273v12.4.0Electron中的Node的NODE_MODULE_VERSION版本和官方给出的对应关系不太一样Electron 4和5的语法变动较大Electron 2已停止维护也就是说nod
转载 6月前
59阅读
Electron 中,你可以在预加载脚本中使用 process.env.APPDATA 来获取应用程序数据目录的路径。以下是一个示例:// preload.js const appDataPath = process.env.APPDATA; console.log(appDataPath);在这个示例中,我们使用 process.env.APPDATA 来获取应用程序数据目录的路径,并将其打
  • 1
  • 2
  • 3
  • 4
  • 5