Skip to main content

NW.js

The SheetJS Standalone scripts can be referenced in a SCRIPT tag from the entry point HTML page.

The "Complete Example" creates an app that looks like the screenshots below:

WindowsmacOSLinux

Windows screenshot

macOS screenshot

Linux screenshot

Integration Details

NW.js provides solutions for reading and writing files.

Reading Files

The standard HTML5 FileReader techniques from the browser apply to NW.js!

NW.js handles the OS minutiae for dragging files into app windows. The drag and drop snippet apply to DIV elements on the page.

Similarly, file input elements automatically map to standard Web APIs.

For example, assuming a file input element on the page:

<input type="file" name="xlfile" id="xlf" />

The event handler would process the event as if it were a web event:

async function handleFile(e) {
const file = e.target.files[0];
const data = await file.arrayBuffer();
/* data is an ArrayBuffer */
const workbook = XLSX.read(data);

/* DO SOMETHING WITH workbook HERE */
}
document.getElementById("xlf").addEventListener("change", handleFile, false);

Writing Files

File input elements with the attribute nwsaveas show UI for saving a file. The standard trick is to generate a hidden file input DOM element and "click" it. Since NW.js does not present a writeFileSync in the fs package, a manual step is required:

/* pre-build the hidden nwsaveas input element */
var input = document.createElement('input');
input.style.display = 'none';
input.setAttribute('nwsaveas', 'SheetJSNWDemo.xlsx');
input.setAttribute('type', 'file');
document.body.appendChild(input);

/* show a message if the save is canceled */
input.addEventListener('cancel',function(){ alert("Save was canceled!"); });

/* write to a file on the 'change' event */
input.addEventListener('change',function(e){
/* the `value` is the path that the program will write */
var filename = this.value;

/* use XLSX.write with type "buffer" to generate a buffer" */
var wbout = XLSX.write(workbook, {type:'buffer', bookType:"xlsx"});
require("fs").writeFile(filename, wbout, function(err) {
if(!err) return alert("Saved to " + filename);
alert("Error: " + (err.message || err));
});
});

input.click();

Complete Example

Tested Deployments

This demo was tested in the following environments:

OS and VersionArchitectureNW.jsDateNotes
macOS 14.3.1darwin-x640.85.02024-03-12
macOS 14.5darwin-arm0.88.02024-05-28
Windows 11win11-x640.94.02024-12-19
Windows 11win11-arm0.88.02024-05-28
Linux (HoloOS)linux-x640.89.02024-07-07
Linux (Debian)linux-arm0.60.02024-05-23Unofficial build1
  1. Create a project folder:
mkdir sheetjs-nwjs
cd sheetjs-nwjs
  1. Create a package.json file that specifies the entry point:
package.json
{
"name": "sheetjs-nwjs",
"author": "sheetjs",
"version": "0.0.0",
"main": "index.html",
"dependencies": {
"nw": "0.94.0",
"xlsx": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz"
}
}
  1. Download index.html into the same folder.

Right-click the link and select "Save Link As...". Left-clicking the link will try to load the page in your browser. The goal is to save the file contents.

In the terminal window, the download can be performed with:

curl -LO https://docs.sheetjs.com/nwjs/index.html
  1. Install dependencies:
npm i
  1. To verify the app works, run in the test environment:
npx nw .

On launch, the app will fetch and parse https://docs.sheetjs.com/pres.numbers .

Using the file input element, a file can be selected from the filesystem and the table will refresh with the contents of the selected file.

Click "Export Data!" and save the generated file to SheetJSNWDemo.xlsx. This file can be opened in Excel or another spreadsheet editor.

  1. To build a standalone app, run the builder:
npx -p [email protected] nwbuild --mode=build --version=0.94.0 --glob=false --outDir=../out ./

This will generate the standalone app in the ..\out\ folder.

There is a regression in nw-builder version 4.12.0. In local win11-x64 testing, version 4.11.6 correctly generated the standalone application.

  1. Launch the generated application:
ArchitectureCommand
linux-x64../out/sheetjs-nwjs
win11-x64..\out\sheetjs-nwjs.exe

Footnotes

  1. The nw60-arm64_2022-01-08 release included an ARM64 version of nw.