Packaging a website with NW.js Step 1: Prepare your website folder
Put all your HTML, JS, CSS, assets into one folder, e.g., mywebsite/.
Your main HTML file should be named something like index.html.
Step 2: Create a package.json for NW.js
Inside your mywebsite/ folder, create a file named package.json with content like this:
{
"name": "mywebsite",
"main": "index.html",
"window": {
"title": "My website",
"width": 800,
"height": 600,
"resizable": false
}
}
Adjust width and height to your website’s resolution. Step 3: Download NW.js
Go to the official site: https://nwjs.io/
Download the Windows SDK version for your architecture (x64 usually).
Extract it somewhere, e.g., C:\nwjs-sdk\.
Step 4: Test your website with NW.js
Open a command prompt (cmd).
Navigate to your website folder:
cd path\to\mywebsite
Run NW.js with your website:
C:\nwjs-sdk\nw.exe .
This should launch your website inside a native window. Step 5: Package your website into a single executable (.exe) Option A: Zip your website files into a app.nw archive
Zip all your website files including package.json into a zip archive.
Rename the zip archive to app.nw.
Option B: Create a single EXE by concatenation
Copy nw.exe to your website folder.
Open command prompt in your website folder and run:
copy /b nw.exe+app.nw mywebsite.exe
This command concatenates nw.exe and app.nw into mywebsite.exe.
You can now run mywebsite.exe to launch your website.
Notes:
If your website folder is large, keep in mind the resulting EXE will include all your assets and NW.js runtime.
For more advanced packaging, you can use tools like nw-builder (npm package) which automates this process.
Example package.json for kios
{
"name": "Website",
"main": "index.html",
"window": {
"title": "Website",
"resizable": false,
"fullscreen": true,
"kiosk": true,
"frame": false, // no window frame (also kiosk does this)
"toolbar": false, // hide toolbar if any
"always_on_top": true // keep window always on top
}
}