Skip to content


Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP


Loading packery with requireJS #20

hjujah opened this Issue · 17 comments

10 participants


Hi Desandro,

I am trying to load packery with requireJS, but I keep getting ,,Uncaught TypeError: Cannot read property 'prototype' of undefined " error message, even if packery is not initialized anywhere on the page. That's 486. row of packery.pkgd.js file.
Any help is appreciated. Thanks...


Yes, I need to test Packery with Require JS


Ok, please let us know about the outcome...


Part of the problem here is that the eventie and eventEmitter dependencies both include shim code that uses define to define the module when requirejs is loading it, and doesn't set a global window.EventEmitter.

However, Packery code depends on these libraries via eg window.EventEmitter. .. But that doesn't get set when loading the deps via requirejs. And RequireJS' shim config doesn't provide a way of forcing that to be set. That is, the shim config is completely ignored if the file, when loaded, uses define(factory). Argh.

@desandro Are you completely against using RequireJS for packery, if you can generate a build (w/ almond) that doesn't require clients to use RequireJS? Alternatively, could you wrap the 4 modules of packery in a UMD wrapper?

Right now I think the only option for RequireJS users to make this work is to intentionally pollute the global scope or include Packery deps outside of AMD. Or, what I'll likely do, copy and paste packery code into an amd-comatible module. But then I won't be able to incorporate new changes very easily.

I will buy an org license if @metafizzy can advise us to success here :)


Are you completely against using RequireJS for packery

Nope. I have been working on adding AMD support to all the dependencies and working up. This is a work in progress.

See eventie and getSize.


Thanks for the response and the project itself, @desandro. Glad to hear support is coming! My project is here and defines an AMD module that gets access to Packery through assumed global scope. I'll watch this thread and update as I can to load via AMD.

Would you like any help? Perhaps in migrating any deps that you don't author?
Or should I just check back in a certain ETA?


Just keep watching this tracker.


Brilliant to hear that AMD support is on the way for such a great library @desandro, thanks!

Have you got any sort of update on how far away it might be? Watching this thread with eager anticipation ;)


Any news about this ?


Hi, we payed the licence and really need to support AMD through RequireJS. Is there an ETA for this fix?


Any update on this?


+1 - would be so nifty to have

@jrolfs jrolfs referenced this issue

Added AMD support #63


I'm looking for feedback on how to best set up RequireJS dependencies in my components. Help me out! See

@desandro desandro referenced this issue from a commit in metafizzy/packery-docs
@desandro desandro add docs for RequireJS b7cac1c

Support for RequireJS has been added in v1.1.0. See

I realize it's a bit of a pain to install with Bower and set up config, but it's for the best!

Try it out and report back if you have any trouble.

@desandro desandro closed this
@desandro desandro referenced this issue from a commit in metafizzy/packery-docs
@desandro desandro make packery.pkgd.js with RequireJS
update docs
Ref metafizzy/packery#20

Good news! :smile_cat: packery.pkgd.js is now being built with RequireJS. This means you can require packery.pkgd.js and not have to worry about getting all the dependencies. Proper docs at

Currently, the RequireJS optimizer outputs packery.pkgd.js with a named module masonry/masonry. This means you need to actually require two modules in order to use Masonry.

requirejs( [
  // require the file
  // require the named module
  // two parameters, packeryPkg is undefined
  // Packery is the working module
], function( packeryPkg, Packery ) {
  new Packery('#container');

One solution is to remove the naming of packery/js/packery

Please chime in if you have a preference either way.


Sweet! I'll try it this weekend, thank you.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.