node webkit 打包exe

Node-Webkit(现更名为NW.js)是一个基于Chromium和Node.js技术的应用运行时(Application Runtime),它可以让你使用HTML5、JavaScript和CSS构建桌面应用程序。Node-Webkit集成了Chromium和Node.js,为Web开发人员提供了使用Web技术开发跨平台桌面应用的便捷方式。接下来,我将详细介绍如何使用Node-Webkit打包Web应用为exe文件。

### 准备工作

首先确保已安装Node.js和npm(Node.js自带的包管理器)。

### 步骤一:安装 nwjs

打开终端或命令提示符,运行以下命令安装`nw`:

```bash

npm install -g nw

```

这将全局安装nwjs,以便我们可以从任意位置运行它。

### 步骤二:创建一个简单的Web应用

在文件夹中创建以下文件:

1. `index.html` - 包含HTML结构和载入css和js

2. `app.js` - JavaScript逻辑

3. `styles.css` - CSS样式

4. `package.json` - 包含应用的基本信息和配置

以下是示例内容:

- `index.html`:

```html

Node-Webkit App

Welcome to Node-Webkit App

```

- `app.js`:

```javascript

document.querySelector('header').addEventListener('click', () => {

alert('Hello from Node-Webkit!');

});

```

- `styles.css`:

```css

body {

font-family: Arial, sans-serif;

text-align: center;

background-color: #F0F0F0;

}

header {

color: #444;

background-color: #EEE;

}

```

- `package.json`:

```json

{

"name": "node-webkit-app",

"version": "1.0.0",

"main": "index.html",

"scripts": {

"start": "nw ."

},

"window": {

"title": "Node-Webkit App",

"toolbar": false

}

}

```

`main`属性指定Web应用的主入口文件(通常为index.html)。`window`对象可以包含有关窗口样式和行为的详细配置,如`title`和`toolbar`等。

### 步骤三:测试应用

在命令提示符处,进入包含上述文件的文件夹并运行以下命令:

```

npm start

```

这会启动Node-Webkit,显示`index.html`内容的窗口。点击标题进行测试。

### 步骤四:打包为exe文件

为了将应用打包为exe文件,我们需要使用`nw-builder`:

```bash

npm install -g nw-builder

```

在项目文件夹中运行以下命令打包应用:

```

nwbuild -p win64 .

```

这将在`build`文件夹下生成可执行的exe文件,默认为64位。`-p`参数可以接受以下值:`win32`, `win64`, `osx32`, `osx64`, `linux32`, `linux64`。可以同时多个目标平台, 具体例子:`nwbuild -p win64,osx64 .`

至此,我们已成功使用Node-Webkit将Web应用打包为exe文件。