Two.js is not competible with Node, or Browserify exactly

[tiye]

I'm a fan of Node.js and I want to package twojs in my code with Browserify.
I tried to place the file build/two.js with a new generated package.json, then require it in a script.
Well, seems it doesn't work.. the _ object behaves strangely..

I found such code like this:
https://github.com/jonobr1/two.js/blob/master/src/two.js#L1304-L1310

  //exports to multiple environments
  if (typeof define === 'function' && define.amd)
  //AMD
  define(function(){ return Two; });
  else if (typeof module != "undefined" && module.exports)
  //Node
  module.exports = Two;

It says in the comments that CommonJS style is supported, I guess.
But it's broken.

[jonobr1]

Yes, that code solicits functionality that actually doesn't exist. I made some changes so that this won't break, but it takes some additional work by you in order to run it in node.js. First checkout the latest from master and use /build/two.clean.js. You'll have to add this to the top of the clean file:

var _ = require('../third-party/underscore.js');
var requestAnimationFrame = require('../third-party/requestAnimationFrame.js');
var Backbone = {};
Backbone.Events = require('../third-party/events.js');

This properly imports the modules and doesn't throw the error you're having. Now I've never used Browserify so I can only assume that provides you with a document variable because there's no way to run anything with two.js unless this is provided. Hope that helps!

[tiye]

@jonobr1 Thanks. It works now, not well tested though.
I regard Underscore as a dependency and did not place that in the repo.

The package could be found here:
https://github.com/jiyinyiyong/twojs-browserify
https://npmjs.org/package/twojs-browserify

And a demo(only the yellow spot, by now) to show it works:
https://github.com/jiyinyiyong/circle-clock/blob/master/coffee/main.coffee#L10
http://s.jiyinyiyong.info/circle-clock/build/index.html

[jonobr1]

Glad it worked, this looks very cool! I look forward to see what you make with it. 👍

[cgfarmer4]

For anyone reading this now, the twojs-browserify package is out of date. You can just use browserify-shim which makes staying up to date easier than relying on a 3rd party.

npm install --save-dev browserify-shim

Package.json

  "browser": {
    "two": "./app/vendor/two.js" 
  },
  "browserify": {
    "transform": "browserify-shim"
  },
  "browserify-shim": {
    "two": "Two" 
  },

This allows you to then do the following in your browserify dev files.

const Two = require('two');

[jonobr1]

Thanks for the update @cgfarmer4. Also, at the time of this writing the latest on the dev branch is dependency free so it should play well with AMD packages / modules.

[oparisy]

Thanks to your explanations @cgfarmer4, I have been able to set up an example of using two.js with browserify. Should it help someone reading this thread, it is available at two-js-browserify-shim.