在前端开发中，我们常常需要进行桌面应用开发。nwjsboilerplate 是一个方便的 npm 包，它提供了一些前端开发所需的工具以及一些基本的配置，使开发者可以在短时间内搭建出一个基本的 nw.js 桌面应用。本文将介绍如何使用 nwjsboilerplate，包括安装、基本配置、使用方法和一些常见问题的解决方法。
安装
首先，我们需要通过 npm 安装 nwjsboilerplate。在命令行中输入：
npm install nwjsboilerplate --save-dev
安装完成后，我们可以在 package.json 文件中看到 nwjsboilerplate 作为 devDependencies 的一部分。
基本配置
在项目的根目录中，我们可以看到 nwjsboilerplate 目录。在这个目录中，我们可以进行一些基本的配置，以适应项目的需求。下面是一些常见的配置项：
package.json
在 nwjsboilerplate/package.json 文件中可以进行如下配置：
- name - 应用的名字
- version - 应用的版本
- main - 应用入口文件
- description - 应用的描述
- keywords - 应用的关键字
- author - 应用的作者
nwjs.json
在 nwjsboilerplate/nwjs.json 文件中可以进行如下配置：
- window - 应用窗口的基本设置
- icon - 应用图标路径
- mac - Mac 平台应用的基本设置
- win - Windows 平台应用的基本设置
- linux - Linux 平台应用的基本设置
.gitignore
在 nwjsboilerplate/.gitignore 文件中，你可以添加你不想提交到 Github 上的文件。一些常见的在 nwjsboilerplate 目录下不应该提交的文件如下：
- node_modules - 已经在 package.json 中声明依赖关系的模块不需要提交
- releases - 打包出的应用将会放到该目录下，也不需要提交
scripts
在 nwjsboilerplate/package.json 文件的 scripts 属性中，可以配置一些 npm 脚本以便于在命令行中进行一些指定的操作，如下：
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"watch": "watch 'npm run build' src/ public/ nwjsboilerplate/",
"build": "gulp build",
"start": "gulp start",
"package": "gulp package"
},使用方法
在配置完成后，我们可以进行应用的开发。在应用开发期间，我们可以通过命令行使用 npm 脚本来进行一些操作。
开发模式
在开发应用时，可以运行如下命令启动应用：
npm start
该命令会执行 gulp start 命令并启动应用，同时会监听应用代码的变更。
打包应用
在应用开发完成后，可以打包成桌面应用。在命令行中输入如下命令：
npm run package
该命令会执行 gulp build 命令，并将打包结果放到 releases 目录中。
发布应用
在应用打包完成后，我们可以选择将应用发布到 GitHub 上。我们可以创建新的 release 并上传打包好的应用。
常见问题
如何调试应用？
在 nwjsboilerplate/package.json 文件中，增加如下配置：
"chrome": {
"args": ["--remote-debugging-port=9222"]
},然后运行如下命令：
npm run debug
如何在 Mac 平台上启用“打开应用程序”功能？
在应用的 Info.plist 文件中，增加如下配置：
<key>LSApplicationCategoryType</key> <string>public.app-category.developer-tools</string>
如何在 Windows 平台上生成安装包？
在 nwjsboilerplate/package.json 文件中，增加如下配置：
"build": {
"win": {
"icon": "app.ico",
"target": [
"nsis"
]
}
},然后运行如下命令：
npm run dist
示例代码
以下是一个简单的 nw.js 应用代码示例：
-- -------------------- ---- -------
---- -------- ---
--------- -----
------
------
----- ----------------
--------- ----- -------------------
-------
------
--------- -----------
-------
--------- -------------------- ---- -------
-- ------
----- -- - ------------------
----- --- - ----------------
-----------
-------------------------- --- ----------------- -
---------------
---在该示例中，我们创建了一个简单的应用，它包括一个 HTML 页面和一个 JavaScript 文件。我们使用 nw.gui 模块以及 NW.js 的 Window API 来控制窗体的显示和关闭。同时，我们使用 nw.Window.open 以打开 HTML 页面。
结论
nwjsboilerplate 是一个快速开发 nw.js 应用的工具包。它提供了一些基本的工具以及配置，简化了 nw.js 应用的开发过程。在本文中，我们介绍了 nwjsboilerplate 的安装、配置以及使用方法，并给出了一些常见问题的解决方法。希望本文对大家有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066f953d1de16d83a66cc6