在前端开发中，我们常常需要在桌面端应用程序中使用 Node.js 的一些功能。nw.js 的出现使得我们能够通过 Web 技术开发跨平台的桌面应用程序，而 nw-ninja 就是一个方便开发者快速构建 nw.js 应用的 npm 包。
本教程将介绍如何使用 nw-ninja 构建一个简单的桌面应用程序，并包含详细的代码示例和指导意义。
什么是 nw-ninja
nw-ninja 是一个针对 nw.js 开发桌面程序的 npm 包，它提供了更为简洁和直接的方式帮助开发者快速地构建出高性能、可定制化的 nw.js 应用程序。相比一些传统的 nw.js 开发方式，例如手写 Webpack 配置或使用 nw-builder 等，nw-ninja 实现了更自动化、便捷的开发体验，使得开发者可以脱离繁琐的配置，更专注于业务逻辑的实现。
安装 nw-ninja
在使用 nw-ninja 之前，我们需要先进行安装。
安装 Node.js
nw-ninja 基于 Node.js 平台开发，因此需要首先在本地安装 Node.js。推荐使用 nvm 进行 Node.js 版本管理。
创建新项目
我们可以使用以下命令创建一个新的 nw-ninja 项目：
mkdir my-app cd my-app npm init
安装 nw-ninja
在项目目录下执行以下命令可以安装 nw-ninja：
npm install nw-ninja --save-dev
初始化 nw-ninja
安装完 nw-ninja 后，我们需要对其进行初始化。
新建文件
在项目目录下，新建一个 src 文件夹，并在其中创建 index.html 和 index.js 两个文件。index.html 文件是整个 nw.js 应用的入口文件，而 index.js 则是业务逻辑的实现。
编写 index.html
打开 index.html 文件，填入以下内容：
-- -------------------- ---- ------- --------- ----- ------ ------ ----- ---------------- --------------- ------------ ------- ------ ---------- -------------- ------- ------------------------ ------- -------展开代码
编写 index.js
在 src 目录下，打开 index.js 文件并填入以下内容：
const nw = require('nw.gui'); nw.Window.open('index.html', {}, win => { console.log('Window opened successfully!'); });
这段代码中，我们首先通过 require 引入了 Node.js 模块中的 nw.gui，然后调用 nw.Window.open 方法打开了 index.html 文件。该方法会创建一个新的窗口，可通过回调函数中的 win 参数获取该窗口的实例。
运行 nw-ninja 应用
完成以上操作后，我们就可以运行 nw-ninja 应用了。
配置 package.json
现在我们需要配置 package.json 文件，开启 nw-ninja 应用。打开 package.json 文件，添加以下内容：
"scripts": { "start": "nw ." }, "nw-ninja": { "version": "0.1.0", "cachePath": "./cache" }
在 scripts 中添加了 start 字段，用于启动 nw-ninja 应用。命令为 nw .，表示以 nw.ninja 配置默认的方式启动应用程序。
在 nw-ninja 中设置了 nw-ninja 的版本号和缓存目录。缓存目录默认为当前目录下的 cache 文件夹。
运行应用
输入以下命令启动 nw-ninja 应用：
npm run start如果一切正常，应该会看到一个新的窗口弹出，显示 "Hello, nw-ninja!"。
高级用法
nw-ninja 不仅可以帮助我们快速搭建一个简单的 nw.js 应用程序，还提供了一些更加高级的配置，增强程序的可定制性。
- 设置应用程序名称
在 package.json 文件中添加 name 字段即可，例如：
{ "name": "My nw-ninja app", // ... }
- 设置窗口大小和位置
通过 nw.Window.get() 方法获取当前打开的窗口实例，即可进行一些高级的自定义配置。例如，以下代码可以将窗口大小设置为 800x600，并将其居中显示：
const nw = require('nw.gui'); const win = nw.Window.get(); win.resizeTo(800, 600); // 设置窗口大小 win.moveTo('center'); // 居中显示
- 设置自定义菜单
可以通过 nw.Menu.get() 和 nw.MenuItem 创建自定义菜单。例如，以下代码可以创建一个在窗口右键点击时弹出的菜单：
-- -------------------- ---- ------- ----- -- - ------------------ ----- ---- - --- ---------- --------------- ------------- ------ ---- --- ------ ---------- - ------------------- ---- - ---- --------------- ------------- ------ ---- --- ------ ---------- - ------------------- ---- - ---- -------------------- - -----展开代码
设置窗口的 menu 属性即可为窗口添加默认菜单。
- 使用本地 Node.js 模块
由于 nw.js 是基于 Node.js 所开发的，因此在 nw.js 应用程序中可以直接使用 Node.js 中的模块。例如，以下代码演示了如何使用 node-fetch 来发起 HTTP 请求：
const fetch = require('node-fetch'); fetch('https://api.github.com/users/github') .then(res => res.json()) .then(json => console.log(json)) .catch(err => console.error(err));
结论
nw-ninja 是一个极其方便的 nw.js 开发工具，在快速构建 nw.js 应用程序方面提供了非常大的帮助。在您的下一个桌面应用项目中，不妨尝试使用 nw-ninja，用较小的成本带来更高的开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005690281e8991b448e4abd
