Onsen-UI cannot load <ons> tags in Meteor

问题

I am trying to move avatars pattern of Onsen UI (http://onsen.io/pattern-list_avatars.html) into a Meteor app, but the tags do not load. Firebug logged message from Onsen:

Onsen UI require jqLite. Load jQuery after loading AngularJS to fix this error. jQuery may break Onsen UI behavior.

This message appeared even though I had jquery package installed and in order to eliminate it I have to include jquery lib into client/lib folder (do not know if that is correct).

I have also added urigo:angular package into my project because Onsen requires Angular but that did not do the trick. Now the only message I get in the log is

WARNING: Tried to load angular more than once.

Which is taken from Onsen code:

if (window.angular.bootstrap) {
//AngularJS is already loaded, so we can return here...
console.log('WARNING: Tried to load angular more than once.');
return;
}

The styling is not applied to elements and they look the following:

How can I solve this?

回答1:

Onsen .js files need to be loaded in a correct order together with jQuery file and Angular file. To achieve this in Meteor I loaded these files in client/lib folder like this:

root
  |- client
    |- lib
     - onsen.js
      |- jQuery
       - jquery.min.js
        |- Angular
         - angular.min.js

Loading in this way solved the problem because meteor load files starting from the deepest node in the folder tree, in this case /Angular folder.

回答2:

Maybe a better solution will be to create an onsen Meteor package and make a dependency to Jquery and Angular Meteor packages.

来源：https://stackoverflow.com/questions/29211791/onsen-ui-cannot-load-ons-tags-in-meteor