Maximus S
Maximus S

Reputation: 11095

Meteor including bootstrap and jQuery

I get an error as soon as I add jQuery and Bootstrap. The three files that I add are

1) a_jquery-1.11.2.min.js // so that it is processed before 'b' in bootstrap
2) bootstrap.min.css
3) bootstrap.min.js

and they are located in /lib.

If I add bootstrap without jQuery, I get an error saying that Bootstrap needs jQuery. After I add jQuery I get the following error messages.

/Users/username/.meteor/packages/meteor-tool/.1.0.40.cbg34i++os.osx.x86_64+web.browser+web.cordova/meteor-tool-os.osx.x86_64/dev_bundle/server-lib/node_modules/fibers/future.js:173
            throw(ex);
                  ^
TypeError: Cannot call method 'createElement' of undefined
    at jb (app/lib/a_jquery-1.11.2.min.js:2:7547)
    at app/lib/a_jquery-1.11.2.min.js:2:22045
    at app/lib/a_jquery-1.11.2.min.js:2:22746
    at c (app/lib/a_jquery-1.11.2.min.js:2:207)
    at app/lib/a_jquery-1.11.2.min.js:2:212
    at app/lib/a_jquery-1.11.2.min.js:6:3
    at /Users/username/my_app/.meteor/local/build/programs/server/boot.js:205:10
    at Array.forEach (native)
    at Function._.each._.forEach (/Users/username/.meteor/packages/meteor-tool/.1.0.40.cbg34i++os.osx.x86_64+web.browser+web.cordova/meteor-tool-os.osx.x86_64/dev_bundle/server-lib/node_modules/underscore/underscore.js:79:11)

Does anyone know what I am missing?

EDIT: I also have a question about including the stylesheets. I include a CDN bootstrap in /client/views/layout.html but as soon as I delete the importing line and save a local bootstrap.min.css file in /lib the styles start breaking. Why does this happen?

Upvotes: 1

Views: 399

Answers (2)

tarmes
tarmes

Reputation: 15442

You can't put them in /lib since anything in there is also loaded by the server. /client/lib would be okay.

Note also that you don't need jQuery, that comes by default (it's used by Blaze).

Finally, I'd recommend using a bootstrap package. If you use this one then you'll by able to make use of all the mixins and also change the base varaibles cleanly. See this article for more information.

Upvotes: 1

Kyll
Kyll

Reputation: 7139

The /lib folder is for shared code, putting client-side frameworks in it will cause you a lot of trouble since Meteor will try to run it on the server too (and miserably fail at finding a window object). Place any client-only code in the client folder instead.

Plus, I would suggest taking a look at packages rather than doing it yourself, a lot of people have already done what you're going through.

If you want to have local style sheets, either put them in the client folder (loaded immediately) or in the public folder (for delayed loading via an import). More about special folders in the documentation.

Upvotes: 2

Related Questions