anvaka / ngraph

Beautiful Graphs
MIT License
1.43k stars 131 forks source link

"Cannot read property 'util' of undefined", fabric module not found #16

Closed Robrechtc closed 9 years ago

Robrechtc commented 9 years ago

Hey guys, I'm having a TypeError when trying to use ngraph.fabric. It is in simpleLine.js and it can't find the "fabric" module. However, when I run a node shell it can find the package just fine. I've tried pretty much everything that I could think of (uninstalling, reinstalling, reinstalling globally, putting my files in the node_modules folder) and nothing worked. Does anyone know where the issue is? Many thanks in advance!

http://imgur.com/2hXbIyY is the full stack trace

anvaka commented 9 years ago

Hi @Boogymanx. I tried to reproduce this in the current example but I couldn't. I've also updated ngraph.fabric to the latest version of dependencies, but couldn't reproduce the bug in either of the examples.

Can you please share a minimal code to reproduce it?

anvaka commented 9 years ago

The code, from your stack trace cannot find fabric object from here. I wonder what version of fabric do you use and how do you include it into the page?

It could also be an order in which you load dependencies. Do you load ngraph.fabric first or fabric?

Robrechtc commented 9 years ago

Hey :) I didn't actually load fabric.js, I figured that it'd be loaded if I required ngraph.fabric (goddamn Mondays). I literally just copied the first example line for line in main.js, then used browserify -d -s ngraph index.js > bundle.js to create the bundle. My HTML page is literally just empty tags with a script src=bundle.js in my body. I'm using the version of fabric installed by npm install fabric. I have added require('fabric'); in my script, but when trying to browserify it again I've found that while my modules are installed in /usr/local/lib/node_modules/, NPM is looking for them in /home/myuser/Documents. I'll try finding out how to change where NPM finds the installed packages.

Robrechtc commented 9 years ago

Can you maybe explain to me exactly how I should install it? I know I found a sudo browserify -s ngraph index.js > bundle.js somewhere, but I clearly did something wrong somewhere and I've retried this process so many times it's getting extremely frustrating. I love what you've done with ngraph and it appears to be pretty much exactly what we need but I'm extremely new to node (and JS in general) and I can't for the life of me figure it out :p this is my script:

require('./node_modules/fabric');
var graph = require('ngraph.graph')();
graph.addLink(1, 2);
var fabricGraphics = require('ngraph.fabric')(graph);
fabricGraphics.run();

This script is in my /home/user/Documents, I have a folder there (/node_modules/) which has a fabric, ngraph.fabric and ngraph.graph folder, all installed with npm install.

anvaka commented 9 years ago

You can follow an example from ngraph.fabric.

mkdir example
cd example

This will just create an example folder and switch to it. Then create an empty npm module:

echo {} > package.json

Now install ngraph.fabric:

npm i ngraph.fabric

Copy content of html file from here. Make sure you point to the correct version of fabric.js library. This is your index.js:

module.exports.main = function () {
  var graph = require('ngraph.generators').grid(10, 10);
  var createFabric = require('ngraph.fabric');
  var fabricGraphics = createFabric(graph);

  // begin animation loop:
  fabricGraphics.run();
}

To compile bundle.js run browserify -s ngraph ./index.js > bundle.js.

You can also consider using VivaGraph, since it's currently built from ngraph.* modules itself into single bundle.

Robrechtc commented 9 years ago

I fucking love you <3 that fixed it! I'll take a look at VivaGraph and send it on to the CEO, but for now I'm gonna mess around a bit with ngraph and see if I can make it work like this :p many thanks again!

anvaka commented 9 years ago

haha, happy to hear this!