Having trouble packaging node webkit app

Question

I wrote a small app in node webkit, and am having trouble packaging it. My eventual goal is to have a .exe that I can give to other people.

I can run it from the command line with "nodewebkit".

I've tried zipping the files and saving the result as app.nw, but when I try to run that I just get the default node webkit screen. I've read through the docs on rogerwang github, but haven't gotten anywhere because I can't get through that first step.

The app consists of a few files: index.html, main.js, styles.css. It depends on a few node modules as well as jquery. The package.json file is pasted below... any suggestions would be much appreciated.

{
  "name": "spl",
  "version": "0.0.0",
  "description": "",
  "keywords": [],
  "main": "index.html",
  "homepage": "https://github.com/lpappone/spl",
  "bugs": "https://github.com/lpappone/spl/issues",
  "window": {
    "title": "Splitter",
    "toolbar": false,
    "frame": true,
    "width": 800,
    "height": 500
  },
  "author": {
    "name": "Lauren Pappone",
    "email": "",
    "url": "https://github.com/lpappone"
  },
  "repository": {
    "type": "git",
    "url": "git://github.com/lpappone/spl.git"
  },
  "dependencies": {
    "fast-csv": "^0.5.3",
    "recursive-readdir": "^1.2.0"
  },
  "devDependencies": {},
  "engines": {
    "node": ">=0.8.0"
  }
}

The directory structure looks like this, and when I inspect the contents of the .nw, it is exactly the same:

Your index.html is in the same level as package.json ? Can we have a example of your directory structure ? — Maxime Mangel, Nov 05 '14 at 08:42
Sure - it's a small app and I didn't know if it mattered, so it's basically all the same level. Project folder contains files: index.html, main.js, bower.json, package.json, styles.css. Also contains folders: bower_components, node_modules, node_webkit-v0.10.2-osx-x64, and resources, which I guess came with node-webkit. — lpappone, Nov 06 '14 at 01:56
That's really strange did you success to just create nodewebkit app with just a package.json file and an index.html file ? — Maxime Mangel, Nov 06 '14 at 06:34
Can you show how you request script in your index.html. Are you using relative path or absolute ? — Maxime Mangel, Nov 06 '14 at 18:15
Did you rename the .zip in .nw ? And try to explore the ".zip" file to see if the directory structure is good. — Maxime Mangel, Nov 06 '14 at 18:20
Yeah I renamed it with .nw. What should the directory structure in the zip be? — lpappone, Nov 06 '14 at 18:31
The same as your project directory. Directly inside the zip file you should have package.json, index.html, etc. — Maxime Mangel, Nov 06 '14 at 18:50
Yep, it looks the same as the structure of the original folder. — lpappone, Nov 07 '14 at 05:29
Can you please make a screenshot of your two directorys structures (the project dir and the zip dir). Because it's really strange. (Edit your post for adding this information). — Maxime Mangel, Nov 07 '14 at 08:56

score 3 · Accepted Answer · answered Nov 12 '14 at 06:14

3

You seem to be doing this on a Mac, so I'll cover that. Windows and Linux are slightly more complicated because they don't have App Bundles the way Mac OSX does. Are you copying your app.nw to the right place? Are you sure you're including everything in app.nw?

Is this what you're doing?:

First you need to create app.nw, which is just a zip file of your entire project. If you go to your project dir (the one containing package.json) you can do this by typing

zip -r ../app.nw .

Now create a copy of node-webkit.app and copy app.nw into node-webkit.app/Contents/Resources/

cp app.nw node-webkit.app/Contents/Resources/

You should be able to run node-webkit.app now and it should run your app. (You might have some issues with security settings and such)

See https://github.com/rogerwang/node-webkit/wiki/How-to-package-and-distribute-your-apps#mac-os-x for further details.

answered Nov 12 '14 at 06:14

OldGeeksGuide

2,888
13
23

Hey, thanks for the help. This did work to run the app from the command line, but what I'm trying to do is produce a user-friendly packaged app - one that they can run by double clicking an icon as they're used to. This app is to help some former co-workers, who are lawyers, and navigating the terminal is just not something they're going to do. I've read that rogerwang page time and time again, but I I can't find node-webkit.app/Contents/Resources/ - there doesn't seem to be any such directory on my computer - and I'm not even sure what that is so I'm not sure what I'm looking for. – lpappone Nov 14 '14 at 04:33
Got it. Learned about application bundles, and ran that line of code you gave me (I needed to include the folder holding the node-webkit.app.) But if I run "node-webkit.app" I get command not found. nodewebkit node-webkit.app and it tells me there's no package.json file. Still don't understand how to package the app so it's usable to the non-computer savvy. – lpappone Nov 14 '14 at 05:09
Got it. Didn't realize I needed to run node-webkit instead of my original app file. That leads to a new error, which I've posted as a new question: http://stackoverflow.com/questions/26924209/node-js-child-process-doesnt-work-in-node-webkit – lpappone Nov 14 '14 at 06:30
Is there any way to develop on mac but distribute for windows? – Kendall Aug 05 '15 at 03:40
You can certainly do your development on Mac, but I'm not sure if you have everything you need to build a windows bundle. The Windows approach is a bit different because they don't have App bundles like Mac, you actually need to concatenate your project onto a Windows EXE (at least that's how they used to do it.) It's sort of similar to the Linux build. In any case, you'll want to try it out on Windows to be sure it works. – OldGeeksGuide Aug 06 '15 at 23:24

Having trouble packaging node webkit app

1 Answers1