nodegui 使用react开发跨平台应用试用
nodegui官方团队提供了基于react 应用开发方式,同时我们集成官方的packer 进行快速的应用打包
项目说明
项目使用了官方的计算机应用,我使用官方的react starter,同时添加了packer ,当前运行环境为mac,windows以及linux
暂时还没有尝试过
环境准备
- clone 代码
git clone https://github.com/nodegui/react-nodegui-starter.git
- 修改index.ts 内容
代码来自: https://github.com/nodegui/examples/blob/master/react-nodegui/calculator/index.tsx - 添加打包支持
npm i @nodegui/packer --save-dev
- 添加npm script
"package":"nodegui-packer --init cal-app && yarn build && nodegui-packer --pack ./dist",
构建&&效果
- 安装依赖
npm i
- 构建&&打包
npm run pacakge
- 效果
- 运行应用
- 内存占用
说明
使用nodegui 开发跨平台桌面应用是一个很不错的选择,如果我们对于内存以及cpu 占用要求比较高的话,可以尝试使用此框架
参考资料
https://github.com/rongfengliang/nodegui-react-cal-packer
https://github.com/nodegui/examples/tree/master/react-nodegui/calculator
https://github.com/nodegui/nodegui
https://github.com/nodegui/react-nodegui-starter
https://github.com/nodegui/packer
nodegui 使用react开发跨平台应用试用的更多相关文章
- 带你从零学ReactNative开发跨平台App开发[react native SqlLite 终极运用](十二)
ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...
- 带你从零学ReactNative开发跨平台App开发-[react native 仿boss直聘](十三)
ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...
- 基于Nodejs生态圈的TypeScript+React开发入门教程
基于Nodejs生态圈的TypeScript+React开发入门教程 概述 本教程旨在为基于Nodejs npm生态圈的前端程序开发提供入门讲解. Nodejs是什么 Nodejs是一个高性能Ja ...
- 用Inferno代替React开发高性能响应式WEB应用
什么是Inferno Inferno可以看做是React的另一个精简.高性能实现.它的使用方式跟React基本相同,无论是JSX语法.组件的建立.组件的生命周期,还是与Redux或Mobx的配合.路由 ...
- 基于Vue.js的uni-app前端框架结合.net core开发跨平台project
一.由来 最近由于业务需要要开发一套公益的APP项目,因此结合所给出的需求最终采用uni-app这种跨平台前端框架以及.netcore快速搭建我们的项目,并且能做到一套代码跨多个平台. 当然在前期技术 ...
- 带你从零学ReactNative开发跨平台App开发(一)
ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...
- java,swift,oc互相转换,html5 web开发跨平台
java,swift,oc互相转换,html5 web开发跨平台 写一个java->swift的程序,这个程序是做跨平台系统的核心部分swift和oc到java也在考虑之列Swift->J ...
- 带你从零学ReactNative开发跨平台App开发(十一)
ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...
- 带你从零学ReactNative开发跨平台App开发(九)
ReactNative跨平台开发系列教程: 带你从零学ReactNative开发跨平台App开发(一) 带你从零学ReactNative开发跨平台App开发(二) 带你从零学ReactNative开发 ...
随机推荐
- 『2019Summer Algorithms』
一个暑假两次集训,感觉学了好多好多的东西,也挖了好多好多的坑,于是就决定写一篇关于算法的总结,用于熟悉新算法,也留下一点对新算法的理解. AC自动机 简单的说就是在\(trie\)树上实现\(KMP\ ...
- 图像上划凸多边形(convexHull()函数)
import numpy as npimport cv2 as cvimg=np.zeros((400,410),np.uint8)points=np.random.randint(100,400,( ...
- python数据分析三剑客之: Numpy
数据分析三剑客之: Numpy 一丶Numpy的使用 numpy 是Python语言的一个扩展程序库,支持大维度的数组和矩阵运算.也支持针对数组运算提供大量的数学函数库 创建ndarray # 1 ...
- cmd脚本
管道命令 | |命令的作用,就是让前一命令的输出当做后一命令的输入. > >会清除掉原有文件中的内容后把新的内容写入原文件: echo @echo off > a.bat. > ...
- 【案例】保健品行业如何优化供应链管理?APS系统来帮忙
仙乐健康一直致力于为了客户提供世界级的产品及服务,随着业务量的不断扩大,公司先后实施了ERP系统,CRM系统,WMS系统,OA系统,朝着行业信息化水平领先的目标迈进. 但近年仅仅拥有传统ERP系统和手 ...
- 自制微擎AI面相识别算术阈值
有时在朋友圈或其他地方会看到一些AI面相的分享链接或小程序,不是面相算命的有多吸引人,而是前面有"AI"两个字母.于是我就上网找了一下相关代码,发现了一个微擎系统的面相模块.下载下 ...
- Centos 7配置阿里云yum源
1. 禁用 yum插件 fastestmirror 1)修改插件的配置文件 # cp /etc/yum/pluginconf.d/fastestmirror.conf /etc/yum/pluginc ...
- spark遇到的问题及解决方法
1. 表中数据过亿,加载速度过慢,而我只需要加载增量数据 如:加载昨天一整天的数据,添加predicates分区,方法如下: //predicates相当于是把昨天的数据分成一个区,其它的数据不加载 ...
- Java开发分析工具JProfiler的详细使用方法解析
JProfiler 11 是一款功能强大的Java代码分析工具,JProfiler的直观UI可帮助您解决性能瓶颈,确定内存泄漏并了解线程问题且JProfiler 11 Mac破解版配置会话非常简单,第 ...
- Ansible--项目实战
Ansible项目实战lnmp 项目规划 通过ansible roles配置lnmp环境,nginx通过源码编译安装,php通过源码编译安装,mysql通过yum安装(mysql源码编译超级慢)支持系 ...