最近要做个桌面的应用，用起来也方便。找了一圈发现NW.js挺容易上手，分享给大家。...NW.js 官网https://nwjs.io/ 1.下载适合当前版本的js 【这里下载的SDK版本，方便后续调试】 2.解压到本地 3.构建自己的project index.html...4.把项目放到nw.js解压后的同一目录下 5.命令进入到当前文件夹 输入 nw myapp 也可以直接把项目拖到nw.exe 6.将应用打包成app.nw文件，进入myapp文件夹中
Javascript在web开发中已经稳稳的占据了重要位置，现在已经开始渗透到桌面开发了 Electron 便是用来创建桌面应用的框架 使用 JavaScript + HTML + CSS 就可以开发跨平台的桌面应用...是否满足桌面应用开发的需求呢？...看下这些知名应用就知道了 GitHub 的文本编辑器 Atom 聊天群组应用独角兽公司 Slack 使用 Electron 搭建了桌面客户端 微软发布的代码编辑器 Visual Studio Code...{ "name": "deskjs", "version": "0.1.0", "main": "main.js" } 格式和 Node 的完全一致，main 字段是应用的启动脚本 index.html... Hello World 第一个 JS 桌面应用</
说到桌面应用程序，可能更多人会想到使用QT或者JAVA FX去实现，Node.js能实现桌面程序么？可能很多人对这个问题的答案抱着怀疑的态度。...实际上Node.js现在生态圈越来越完善，所以用Node.js实际上可以非常轻松的架构一个桌面应用。今天我们来讲讲Node.js是如何构建一个桌面应用。 首先我们需要创建一个Node.js项目。 ?...所以我们可以发现，我们使用electron进行桌面应用的开发我们不需要去了解我写的html是如何被转化成桌面应用执行程序的。用官方的解释来说就是简单的部分你来做，复杂的交给我们框架来负责实现。...接下来我们需要将我们的应用打包生成桌面应用启动文件，打包就需要使用我们刚才一开始安装的依赖：electron-packager。...我们执行这个文件就可以运行我们的桌面应用了。 ? 最后我们来谈谈，使用Node.js结合electron模式开发桌面应用有什么优缺点呢？
1、下载nw.js https://nwjs.io/ 最好下载sdk版本。 2、解压打开安装包 下载完之后，解压打开 图中的「app文件夹」是我自己创建的，你也需要自己创建一个，里面放你项目文件。...下载链接打开它，选中「app.exe」然后将你刚才下好的nw.js里原始文件（除去你自己生成和创建的文件或文件夹）。
Node.js常用来构建高并发的C/S应用，将这种模式移植到NW.js程序中虽然可行且费不了什么功夫，但仅仅这样做并不能发挥出平台所有的潜力；要知道NW.js允许直接在DOM中和Node.js交互，而这将大大加快程序的运行和简化开发...使用Node.js模块 内部模块 var fs = require('fs') 第三方模块 npm install 之后 var _ = require('underscore') C/C++ 模块...global对象 NW.js中的global对象除了Node.js中的作用，还能使用DOM，这样就提供了一个 在窗口和Node.js上下文中共享对象 的途径；此外，一旦window对象被创建，所有global...'data/my.json') ); //Mac输出'/xxx/myApp/data/my.json'，Win输出'c:\\xx\\myApp\\data\\my.json' 针对某些特殊路径，比如桌面...代替解决 或者采用 nwglobal模块，使DOM环境中可以正确判断来自 Node.js 的类型： //nodeContext.js exports.myArr = [1, 2, 3];//index.html
一、桌面应用程序 ? 桌面应用程序，又称为 GUI 程序（Graphical User Interface），但是和 GUI 程序也有一些区别。...桌面应用程序 将 GUI 程序从GUI 具体为“桌面”，使冷冰冰的像块木头一样的电脑概念更具有 人性化，更生动和富有活力。...我们电脑上使用的各种客户端程序都属于桌面应用程序，近年来WEB和移动端的兴起让桌面程序渐渐暗淡，但是在某些日常功能或者行业应用中桌面应用程序仍然是必不可少的。...Electron是由Github开发，用HTML，CSS和JavaScript来构建跨平台桌面应用程序的一个开源库。...～ 当然，我们也要认清它的缺点：性能比原生桌面应用要低，最终打包后的应用比原生应用大很多。
Wails 是一个可让您使用 Go 和 Web 技术编写桌面应用的项目。将它看作为 Go 的快并且轻量的 Electron 替代品。...内置 Svelte、React 、Preact 、Vue、Lit 和 Vanilla JS 的模板 3. 从 Javascript 轻松调用 Go 方法 4....使用 Wails 构建的应用程序兼容 Apple & Microsoft 商店 这是 varly - 一个使用 Wails 编写的 MacOS 和 Windows 桌面应用。...Wails 使用专门构建的库来处理窗口、菜单、对话框等原生元素，因此您可以构建美观、功能丰富的桌面应用程序。 它不嵌入浏览器，因此性能高。相反，它使用平台的原生渲染引擎。...自动重新构建，当您在“开发”模式下运行您的应用程序时，Wails 会将您的应用程序构建为原生桌面应用程序，但会从磁盘读取您的资源。
NW.js的用途 NW.js 基于 Chromium 和 Node.js，从而可以在桌面app中使用浏览器开发技术并直接调用 Node.js 资源，甚至将一个web应用打包到本地也轻而易举。...安装NW.js 可以从官网下载； 推荐在开发时下载是sdk版，以使用DevTools 非sdk版也应同时下载，在发布时使用 写一个 Hello World!...index.html", "window": { "width": 500, "height": 500, "resizable": false }} 入口文件指定为"index.html" 如果指定一个js...title> Hello NWJS~ == 右键单击可看到菜单 == //此处演示调用`NW.js...are running on ' + os.platform() + ''; 运行NW.js
--registry=https://registry.npm.taobao.org 安装 electron 这里我是使用的全局 $ sudo cnpm install -g electron 创建应用...一个 Electron 应用的目录结构大致如下： myapp/ ├── package.json ├── main.js └── index.html package.json { "name":..."myapp", "version": "0.1.0", "main": "main.js", "scripts": { "start": "electron main.js"...Electron: document.write(process.versions.electron) 运行应用...进入应用程序目录，然后运行 $ electron .
NIM_Duilib_Framework 主要开发语言: C/C++ 简介: Duilib是一个Windows下免费开源的DirectUI界面库，由于简约易扩展的设计以及稳定高效的实现被各大互联网公司普遍接受，广泛应用于包括...www.electronjs.org/ 中文官网: https://electron.org.cn/ 简介: Electron 是一个能让你使用 JavaScript, HTML 和 CSS 来创建桌面应用程序的框架...这些应用程序可以打包后在 macOS、Windows 和 Linux 上直接运行，或者通过 Mac App Store 或微软商店进行分发。
Electron 基于 Chromium 和 Node.js, 可以理解为在软件中打包了一个浏览器以支持运行桌面应用，用开发web的方式进行开发，跨平台兼容 1环境搭建 1.1 先全局安装脚手架
[I] 概述 - NW.js原生界面(Native UI)APIs 要构建一个像样的桌面应用，除了由NodeJS处理底层功能，以及由Webkit来应付窗口GUI外，还需要诸如操作窗口、访问剪贴板或隐藏到系统托盘区等和系统图形界面交互的能力...App API - 应用的核心 2.1 打开关联类型的文件 NW.js应用有多种办法打开文件，此处谈论的是打开关联的文件类型；也就是说如果我们开发一个文本编辑器，那么我们希望在系统中右键单击一个txt文件出现的...); 2.4 关闭应用 如果以NW.js应用正常的生命周期来理解，应用打开的所有窗口都依次关闭后，整个应用才能退出；不过有两种方法可以干预这一进程： App.closeAllWindows() 该方法会触发各子窗口的...Menu API - 菜单栏和右键中的菜单 NW.js中，共有三种类型的菜单： 上下文菜单：右键单击应用内的元素时 窗口菜单：在Windows或Linux中，每个窗口上方都可以有自己的菜单栏；==在Mac...在NW.js里，同样的操作只是传递文件路径字符串而已，而非拷贝其内容；同时一些浏览器中的安全限制被解除，并赋予其一些增强的能力，从而使用户体验更接近原生应用
说到 node.js 的 GUI 开发方案，首先想到的就是 electron 和 nw.js。但除了它们之外，是否存在其它更轻量级的技术方案可供选择呢？...但打包了 Chromium 内核和 node.js 环境后，如今的 electron 和 nw.js 动不动就上百MB的大小，用来开发这样的小工具实在是不划算。...支持安卓、iOS、桌面等多平台。 看起来具体实现基本就是把 react-native、electron 等方案整个打包，再增加了对 Win10 的 UWP 支持，是个大而全而非小而轻的方案？...这么说来，近几年桌面开发似乎越来越不温不火，大家的关注中心似乎都转移到了移动端上。...或许可以这么说，我们现在正经历着桌面端开发向移动端转移中心的过渡期。桌面端 GUI 开发的需求存在感日渐稀薄，现有传统开发方案已能应对日常需求，所以虽然也有一些技术痛点，却并没有更新开发方式的必要。
与web开发中主要将数据保存在服务器端不同(cookie中仅保存极少量信息且会过期)，数据持久化(Data Persistence)是本地应用开发中的常见需求，通俗的讲就是将瞬时数据（比如内存中的数据，...断电即失效）保存为持久数据（比如写入数据库中长久保存）； 由于NW.js的特性，可供选择的本地持久化方案非常丰富，既可以依赖于Node.js直接使用NeDB、LowDB等第三方数据库方案，也可以使用HTML5...直接存储数据到本地文件 正如之前的文章提到过的，NW.js提供了App.dataPath来访问系统的应用数据目录， 可以利用其方便的存储应用配置文件等 不同平台上的具体指向： Win: $LOCALAPPDATA...); db.get('mittens').then(function (doc) { return db.remove(doc); }); https://github.com/nwjs/nw.js
package.json：应用的入口文件。其中的main字段表示的脚本是应用的启动脚本，缺省值是index.js。 src/main：electron主进程。...使用 安装完成之后，我们在src/render/main.js中引入element ui。
本文目录： 前言electron的地位electron中js通过web socket与python通信效果图参考一番今日 前言 今天该务实了。...因此，我们做electron开发，其实就是做js前端开发。那么要想在eletron中调用python，实际就是用js去调用python，相关的技术可以在网上搜索js调用python的相关方法。...electron中js通过web socket与python通信 上一篇我们通过js zerorpc模块实现了与python的通信。这次我们通过web socket的方式来做。...index.ejs 这个文件其实是我们的html文件入口，我们屏蔽demo自带的界面，加入我们自己的页面和js脚本。...参考 如何实现JS前端与Python后台的结合 介绍—Vue.js 一番今日 今天一番去看了《中国机长》，面对死亡，能保持镇定，非常值得佩服，也是一种难得的气质。
Electron 框架的前身是 Atom Shell，可以让你写使用 JavaScript，HTML 和 CSS 构建跨平台的桌面应用程序。...它是基于io.js 和 Chromium 开源项目，并用于在 Atom 编辑器中。Electron 是开源的，由 GitHub 维护，有一个活跃的社区。...最重要的是，Electron 应用服务构建和运行在 Mac，Windows 和 Linux。...Electron应用包含三部分： 1、package.json依赖文件 2、index.html应用页面 3、main.js or renderer.js主进程or渲染进程 Electron应用由主进程和渲染进程组成.../renderer.js') 最终效果： ?
本文目录： 前言python处理electron部分参考一番今日 前言 前一篇一番实现了在js里调用python程序，这一篇一番试图将electron页面上输入的一些参数传递给python程序。...start running on {}'.format(addr)) s.run() if __name__ == '__main__': main() electron部分 index.js.../render.js') 功能模块render.js const zerorpc = require("zerorpc") let client = new zerorpc.Client
\Desktop\tmp\dist>npm -v 8.5.5 3.新建文件夹deskApp(名字随意) 4.将vue打包后的dist文件夹拷贝到deskApp 5.在dist文件夹里面新建main.js...和package.json文件 main.js const {app, BrowserWindow} = require('electron'); let win; let windowConfig =...": "demo", "productName": "项目名称", "author": "作者", "version": "1.0.4", "main": "main.js..."url": "http://xxxxx/download/" } ] }, "dependencies": { "core-js...electron-packager": "^12.1.0", "electron-updater": "^4.4.0" } } 6.在dist目录下运行electron-builder 目录结构 生成的桌面应用
本文目录： 前言js启动python创建python文件在index.js中调用python参考一番今日 前言 前面我们实践了用electron-vue和element-ui的开发环境搭建，实现了一个入门...demo，知道了怎么让这个程序运行起来，今天我们来探究下如何用electron里的js主程序调用python程序。...js启动python 创建python文件 首先我们在项目根目录下与src同级目录创建py目录，用来存放python文件。 我们新建一个python文件gzh.py。...if __name__ == '__main__': main() 在index.js中调用python 在index.js的最后添加如下代码调用python。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频
