十分钟轻松入门 nw.js 实现桌面应用程序

最近别的组有项目里面使用了 nw.js 去实现了桌面应用程序,出于好奇,我查找了一些资料,准备了解一下入个门。

什么是 nw.js

https://github.com/nwjs/nw.js

node-webkit 更名为 NW.js。

NW.js 是一个基于 Chromium 和 node.js 的应用运行时。 可以使用 NW.js 以 HTML 和 JavaScript 编写本机应用程序。 它还允许您直接从 DOM 调用 Node.js 模块,并启用一种使用所有 Web 技术编写本机应用程序的新方法。

它是在英特尔开源技术中心创建的。

下载 nwjs-sdk

https://nwjs.io/downloads/

运行一下 ,就会弹出 nw.js 的窗口了。

点击 kaimo 就可以出现下来的菜单

十分钟轻松入门 nw.js 实现桌面应用程序

demo4:实现切换主题的功能

这里可以参考我之前写的,html + css + js 怎么实现主题样式的切换/p>

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <meta http-equiv="X-UA-Compatible" content="IE=edge">    <meta name="viewport" content="width=device-width, initial-scale=1.0">    <title>凯小默的博客测试nwjs</title>    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/element-ui/2.15.9/theme-chalk/index.css">    <style>body {    padding: 50px 100px;    background-color: var(--background-color);}.box {    margin-top: 20px;    padding: 10px;    border: 1px solid var(--border-color);    box-shadow: var(--box-shadow)}.box:hover {    box-shadow: var(--box-shadow-hover)}.box .text {    color: var(--text-color);}.box .text-sub {    margin-top: 10px;    color: var(--text-color-sub);}    </style></head><body></sp

声明:本站部分文章及图片源自用户投稿,如本站任何资料有侵权请您尽早请联系jinwei@zod.com.cn进行处理,非常感谢!

上一篇 2022年7月16日
下一篇 2022年7月16日

相关推荐