name 文件名 data 数据 type mime类型 saveAs: function (name, data, type) { const ele...
1、点击[命令行窗口] 2、按<Enter>键 3、点击[命令行窗口] 4、按<Enter>键 5、按<Enter>键 6、点击[test.xlsx]
最近要做个桌面的应用,用起来也方便。找了一圈发现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 就可以开发跨平台的桌面应用...是否满足桌面应用开发的需求呢?...右边的界面是不是很熟悉,因为Electron就是基于Chromium的 代码结构 electron_test ├── package.json ├── main.js └── index.html package.json...{ "name": "deskjs", "version": "0.1.0", "main": "main.js" } 格式和 Node 的完全一致,main 字段是应用的启动脚本 index.html... Hello World 第一个 JS 桌面应用</
从最开始我开始写文章就讲过Node.js与Java的优缺点,我当时说过,JAVA能做的如果非要使用Node.js最后肯定是能实现的,但是我们会考虑用什么更加适合。...说到桌面应用程序,可能更多人会想到使用QT或者JAVA FX去实现,Node.js能实现桌面程序么?可能很多人对这个问题的答案抱着怀疑的态度。...实际上Node.js现在生态圈越来越完善,所以用Node.js实际上可以非常轻松的架构一个桌面应用。今天我们来讲讲Node.js是如何构建一个桌面应用。 首先我们需要创建一个Node.js项目。 ?...接下来建立一个index.js,在这个文件里面创建桌面窗口以及页面渲染。 首先在文件顶部引入所需的包以及定义一个全局变量win ? 为什么需要这个全局变量呢?...我们执行这个文件就可以运行我们的桌面应用了。 ? 最后我们来谈谈,使用Node.js结合electron模式开发桌面应用有什么优缺点呢?
1、下载nw.js https://nwjs.io/ 最好下载sdk版本。 2、解压打开安装包 下载完之后,解压打开 图中的「app文件夹」是我自己创建的,你也需要自己创建一个,里面放你项目文件。...下载链接打开它,选中「app.exe」然后将你刚才下好的nw.js里原始文件(除去你自己生成和创建的文件或文件夹)。
以实现编号 saveimg(imag,filename); end %output: Input the path you want to use: F:\PictureDownload\ %图片被保存到了
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
实现的效果演示视频如下: 动态添加 HtmlTable 行并保存到数据库 范例运行环境 操作系统: Windows Server 2019 DataCenter 数据库:Microsoft SQL Server
一、桌面应用程序 ? 桌面应用程序,又称为 GUI 程序(Graphical User Interface),但是和 GUI 程序也有一些区别。...桌面应用程序 将 GUI 程序从GUI 具体为“桌面”,使冷冰冰的像块木头一样的电脑概念更具有 人性化,更生动和富有活力。...我们电脑上使用的各种客户端程序都属于桌面应用程序,近年来WEB和移动端的兴起让桌面程序渐渐暗淡,但是在某些日常功能或者行业应用中桌面应用程序仍然是必不可少的。...4.2 使用 Node.js 的 API ? 你可以同时在Electron的主进程和渲染进程使用Node.js API,)所有在Node.js可以使用的API,在Electron中同样可以使用。...shell.openExternal(`file://${screenshotPath}`) this.setState({ imgMsg: `截图保存到
Deft是一个高性能跨平台开源UI框架,底层使用Rust开发,支持使用JS/React开发界面,目前支持Linux,Windows,MacOS和Android等系统。...构建成功后,就能看到预览窗口了,可以直接修改ui目录下的JS/TS文件实时预览效果。...├── package.json -- JS项目配置文件├── package-lock.json├── src -- Rust源代码│ └...打包完成后,会在target/你的系统架构/release/目录下生成一个单独的可执行二进制文件(包含编译后的JS代码),将其拷贝出来即可。...github.com/deft-ui/deft文档:https://deft-ui.github.io/guides/what-is-deft/官方同时提供贪吃蛇,视频播放器,视频格式转换器,SPICE远程桌面客户端等多个
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
[I] 概述 - NW.js原生界面(Native UI)APIs 要构建一个像样的桌面应用,除了由NodeJS处理底层功能,以及由Webkit来应付窗口GUI外,还需要诸如操作窗口、访问剪贴板或隐藏到系统托盘区等和系统图形界面交互的能力...而前面提到的两者,要么无法访问GUI,要么受限于API边界,均无法提供 NW.js Native UI APIs 则在其他JS层的顶部提供了这些完整的功能 1.1 获取nw实例 旧版本中可以用 var...Window API - 操作NW.js窗口 在NW.js中,Window API 只不过是对DOM中window对象的一层包装,很多(并非所有)方法和属性继承了后者的用法,同时window对象也是 Node.js...': 'path/to/js', //在文档loaded前注入的脚本 'inject-js-end': 'path/to/js' //在文档unloaded前注入的脚本 }); 优化窗口显示时机...win.on('move', (x,y)=>console.log(x, y)); win.on('resize', (w,h)=>console.log(w, h)); 3.3 改变窗口状态 每个桌面窗口都有几种不同的状态
说到 node.js 的 GUI 开发方案,首先想到的就是 electron 和 nw.js。但除了它们之外,是否存在其它更轻量级的技术方案可供选择呢?...但打包了 Chromium 内核和 node.js 环境后,如今的 electron 和 nw.js 动不动就上百MB的大小,用来开发这样的小工具实在是不划算。...支持安卓、iOS、桌面等多平台。 看起来具体实现基本就是把 react-native、electron 等方案整个打包,再增加了对 Win10 的 UWP 支持,是个大而全而非小而轻的方案?...这么说来,近几年桌面开发似乎越来越不温不火,大家的关注中心似乎都转移到了移动端上。...或许可以这么说,我们现在正经历着桌面端开发向移动端转移中心的过渡期。桌面端 GUI 开发的需求存在感日渐稀薄,现有传统开发方案已能应对日常需求,所以虽然也有一些技术痛点,却并没有更新开发方式的必要。
中仅保存极少量信息且会过期),数据持久化(Data Persistence)是本地应用开发中的常见需求,通俗的讲就是将瞬时数据(比如内存中的数据,断电即失效)保存为持久数据(比如写入数据库中长久保存); 由于NW.js...的特性,可供选择的本地持久化方案非常丰富,既可以依赖于Node.js直接使用NeDB、LowDB等第三方数据库方案,也可以使用HTML5及其相关标准中提供的WebSQL、WebStorage、IndexedDB...等方案,甚至直接将简单的数据保存到本地文件中 [I]....直接存储数据到本地文件 正如之前的文章提到过的,NW.js提供了App.dataPath来访问系统的应用数据目录, 可以利用其方便的存储应用配置文件等 不同平台上的具体指向: Win: $LOCALAPPDATA...); db.get('mittens').then(function (doc) { return db.remove(doc); }); https://github.com/nwjs/nw.js
5、激活规则 6、save,刷新页面 7、跨域问题解决 修改CustomRules.js 1、接口抓包 找到要mock的接口,打开fiddler抓包 以某某接口为例,找到下面的接口 http://...XXX/SYSTEMS 2、复制该接口数据到本地 在接口上进行右键点击,选择save -> …and Open as Local File -> 默认会保存至桌面,示例中的数据,保存到了桌面的XX.json...下图区域 3、修改你要mock的数据 修改保存到本地的json文件。...符号 7、跨域问题解决 修改CustomRules.js 打开CustomRules.js文件后在static function OnBeforeResponse函数体内再加上如下代码: static...,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization"; } } 保存js
特性 成本低 主应用使用成本低 子应用适配成本低 速度快 子应用首屏打开速度快 子应用运行速度快 原生隔离 css 样式通过 Web Components 可以做到严格的原生隔离 js 运行在 iframe...中做到严格的原生隔离 功能强大 支持子应用保活 支持子应用嵌套 支持多应用激活 支持应用共享 支持去中心化通信 支持生命周期钩子 支持插件系统 支持 vite 框架 开源项目地址:https://github.com...特性 跨框架,任何框架可以使用 Omi 自定义元素 提供桌面、移动和小程序整体解决方案 小巧的尺寸和高性能 基于 Shadow/Light Dom 设计 符合浏览器的发展趋势以及 API 设计理念 Web...DOM 融合,Omi 既使用了虚拟 DOM,也是使用真实 Shadow DOM,让视图更新更准确更迅速 局部 CSS 最佳解决方案(Shadow DOM),社区为局部 CSS 折腾了不少框架和库(使用 js
[图片] 《Vue.js 高效开发之路》 第二场分享的嘉宾是来自Vue.js 团队成员蒋豪群,他的演讲主题是:《Vue.js 高效开发之路》。...《Flutter桌面应用开发》 第三场分享是由郭力恒老师为我们带来的《Flutter桌面应用开发》。 郭力恒老师是来自广发证券的前端架构师,负责基于H5技术的股票交易终端的研发。...本次分享的主要内容是: Flutter桌面端的运行原理 Flutter与底层的通信 [图片] 郭力恒老师较为详细的介绍了Flutter在桌面端运行的优势和现状,以及如何使用跨端开发语言rust来开发桌面...《微保小程序的开发与架构实践》 最后一场是由赵小溪老师为我们带来的《微保小程序的开发与架构实践》。...赵小溪老师是来自微保(腾讯旗下保险平台)的前端架构师,其擅长小程序、WEB平台的基础架构搭建、工程化的规划与实施。
领取专属 10元无门槛券
手把手带您无忧上云