How to package a NW.js application on Windows

Question

I am reading the instructions for how to package a NW.js app and the wording is a confusing mess and makes no sense. I highlighted the contradictory word-salad parts.

Create a zip file (this is built into XP, Vista and 7) Copy all of your files into the zip file, retaining directory structure and making sure that the package.json file is in the root directory (if you make a zip file containing a folder with your stuff in it, then it's not going to work) Rename the file extension from .zip to .nw. By default, file extensions may be hidden. You need to (press alt), go to folder options and uncheck "Hide extensions for known file types" to be able to rename the zip.

Is there a simple step by step instruction set for how to do this ? I looked online and couldn't find any for Windows OS. The goal is to create an executable file ( .exe ) with the innards of the application hidden from users.

I've done it on Mac before but never windows. The way the official documentation is written is just too confusing and all over the place for me to understand.

Gyronny

The first step is same in all platforms though commands are different. The .nw file is same. Since you have done it on Mac, what you should do is to create same file. You can even copy .nw file you created in Mac. – Nicety

Answer 1

For this purpose, you can use https://github.com/nwjs/nw-builder

Lets you build your NW.js apps for mac, win and linux via cli. It will download the prebuilt binaries for a newest version, unpacks it, creates a release folder, create the app.nw file for a specified directory and copies the app.nw file where it belongs.

First of all, install the node-webkit-builder module globally using:

$ npm install node-webkit-builder -g

Once the module has been installed, you can run the nwbuild command as follows:

$ nwbuild [options] [path]

Whereas path is the path to your project folder, options are the ones described in the following code:

-p Operating System to build ['osx32', 'osx64', 'win32', 'win64']
-v NW.js version [default: "latest"]
-r Runs NW.js project [default: false]
-o The path of the output folder [default: "./build"]
-f Force download of node-webkit [default: false]
--quiet Disables logging

Some examples:

1. Run a project (on the current platform):

   $ nwbuild -v [version of your nw.js] -r /path/to/the/project
   

2. Build a project (executable file ( .exe )) for Win32 or/and Win64 platforms:

   $ nwbuild -v [version of your nw.js] -p win32,win64 /path/to/the/project
   

If your cmd currently open in the project folder, instread write full path to your project you can just use dot symbol

Anglonorman

This gave me a bunch of errors and the build folder ends up empty – Gyronny

@Gyronny I test this method, I use NW.js 0.12.3 and run nwbuild with nwbuild -v 0.12.3 -p win32,win64 . without errors. What errors do you get? – Anglonorman

When I use the version you mentioned it seems to work. When I use the default version it throws an error and can't find "ffmpegsum.dll". Looking online a lot of people seem to have this problem. – Gyronny

@Gyronny That's right. You need to write your NW.js version currently installed and it's will work – Anglonorman

When I explicitly type -v 0.15.1 (this is the current version) it doesn't work and I get the error I mentioned. When I type -v 0.12.3 it works fine. – Gyronny

@Gyronny Hmm. I just tried to install version 0.15.1 and get the same error. I really can not understand why this is happening. The only thing that I could find for this issue is github.com/nwjs/nw-builder/issues/309 – Anglonorman

v0.25.4 runs without errors, but produces all empty folders.Using the version here works to create files and the .exe, but the .exe doesn't work (correctly) . It shows my start.js file in plaintext lol. They probably provided new ways to handle .exe creation – Sportsman

Answer 2

You're welcome to my batch file that automates everything. It compiles, updates time stamps of all files to be included, and runs your app for testing.

Works perfect under XP or W7.

NB: Just search & replace all instances of "SourceDir", "DestinDir", and "ProgName" as required.

@echo off
title ProgName Compile & Run Script (c) 2016
cls
set FILETOZIP=C:\SourceDir\*.*
set TEMPDIR=C:\temp
: rmdir %TEMPDIR%
mkdir %TEMPDIR%
xcopy /s %FILETOZIP% %TEMPDIR%
cd C:\temp
copy /b *.* +,,
cd C:\DestinDir
echo Set objArgs = WScript.Arguments > Temp.vbs
echo InputFolder = objArgs(0) >> Temp.vbs
echo ZipFile = objArgs(1) >> Temp.vbs
echo CreateObject("Scripting.FileSystemObject").CreateTextFile(ZipFile, True).Write "PK" ^& Chr(5) ^& Chr(6) ^& String(18, vbNullChar) >> Temp.vbs
echo Set objShell = CreateObject("Shell.Application") >> Temp.vbs
echo Set source = objShell.NameSpace(InputFolder).Items >> Temp.vbs
echo objShell.NameSpace(ZipFile).CopyHere(source) >> Temp.vbs
echo wScript.Sleep 2000 >> Temp.vbs
del C:\DestinDir\ProgName.exe /f /s
CScript Temp.vbs  %TEMPDIR%  C:\DestinDir\ProgName.zip
ren C:\DestinDir\ProgName.zip ProgName.nw
copy /b nw.exe+ProgName.nw ProgName.exe
del C:\DestinDir\Temp.vbs /f /s
del C:\DestinDir\ProgName.nw /f /s
rmdir C:\temp /s /q
start ProgName.exe

Allegiance

Answer 3

nw-builder does not support the NW.js newest versions (version > 0.12) before the 02/July/2016 release, it has support now, but stills in alpha/beta state.

You can try using nwjs-builder, easy and powerfull (with ffmpeg prebuilt support via withFFmpeg option), you can use from command line and as a module, if you want to use it as a module and automate builds with (for example) using gulp, you can do something like this:

var gulp = require('gulp'),
    glp = require('gulp-load-plugins')(),
    del = require('del'),
    nwb = require('nwjs-builder'),
    argv = require('yargs').alias('p', 'platforms').argv,
    paths = {
        build: './build',
        src: './src',
        images: './src/images'
    },
    detectCurrentPlatform = function () {
        switch (process.platform) {
        case 'darwin':
            return process.arch === 'x64' ? 'osx64' : 'osx32';
        case 'win32':
            return (process.arch === 'x64' || process.env.hasOwnProperty('PROCESSOR_ARCHITEW6432')) ? 'win64' : 'win32';
        case 'linux':
            return process.arch === 'x64' ? 'linux64' : 'linux32';
        }
    };

gulp.task('build', ['clean:build'], function () {
    return new Promise(function (resolve, reject) {
        nwb.commands.nwbuild(paths.src, {
            version: '0.15.4',
            platforms: argv.p ? argv.p : detectCurrentPlatform(),
            withFFmpeg: true,
            production: true,
            macIcns: paths.images + '/icon.icns',
            winIco: paths.images + '/icon.ico',
            sideBySide: false,
            //outputFormat: 'ZIP',
            outputDir: paths.build
        }, function (err) {
            if (err) {
                reject(err);
            }
            return resolve();
        });
    });
});

gulp.task('clean:build', function () {
    return gulp.src(paths.build, {
        read: false
    }).pipe(glp.clean());
});

required dependencies in your manifest (adjust your desired versions):

"devDependencies": {
    "del": "^2.2.1",
    "gulp": "^3.9.1",
    "gulp-clean": "^0.3.2",
    "gulp-load-plugins": "^1.2.4",
    "nwjs-builder": "latest",
    "yargs": "^4.7.1"
}

You can get a lot of more documentation about use and args on the main GitHub repo.

Grig