Okay, so slowly I am converting my code over to v1.3 with an imports folder and entirely React (I still had a bit of a mix before the switch), but I am having some really serious issues when trying to import meteor packages.
Clearly you can see that the debugger at least knows that StripeCheckout is defined, perhaps from the global? But when it comes to running that piece of code, StripeCheckout is undefined (as you can see in the console window).
I thought that I was doing it correctly, as per | Meteor Guide but clearly I’m missing something.
EDIT: Turns out that I picked a really bad example as the client version of mrgalaxy:stripe simply injects some script tags into the <head>. Though I get the same issue with a few other packages… I’ll check them now, and report a better example!
EDIT 2: One of the other scripts I’m struggling with is the chrismbeckett:toastr package but he doesn’t seem to have his code available in GitHub anymore (weird!), so I’ve switched that to the core NPM package (which I now can’t load the CSS for, but that’s another issue!).
Finally, mizzao:bootboxjs I am having the same issue as described with; I call: import { bootbox } from 'meteor/mizzao:bootboxjs';
and when I come to use it, it is undefined, now this just may be down to how it is exported, this is all new to me (imports/exports) so I’m learning as I go!
then bootbox would be defined, but it would be added to your project as a global. This comes down to how the mizzao:bootboxjs wrapper package currently works (when it wraps the bootbox projects bootbox.js, no module loader is matched, so bootbox is stored as a global).
The above being said, since mizzao:bootboxjs is a wrapper package, you should try using the bootbox npm package instead:
Ah ha! Thank you so much for explaining it all @hwillson!
I agree that I would love to add it via NPM, but if I do, it expects Bootstrap’s jQuery extensions to be in the NPM version of jQuery, when they aren’t as they are loaded via an atmosphere package into Meteor’s jQuery version.
If I switch Bootstrap over to NPM problem solved right? Nope. I can’t import LESS files from the /node_modules folder, so I’d have to effectively have it solely for the JS, and use the atmosphere package for the LESS files… Seemed a bit crazy and hacky!
I know, definitely a pain until issue 6037 gets resolved.
Here’s a really quick workaround for this (but I agree - it definitely looks hacky):
Remove the Meteor jquery and bootstrap packages if you have them installed via meteor add.
Add jquery and bootstrap via npm install.
Update your imports as:
global.jQuery = require('jquery');
require('bootstrap');
import bootbox from 'bootbox';
You’ll then be able to use bootbox installed via npm, and it won’t complain about jQuery/Bootstrap issues (doesn’t help with your .less issues though …).
Yeah, I’m kinda holding out hope that 1.3.2 will be released fairly swiftly, and with it I can at least import the CSS files of the NPM bootstrap installation, if not the LESS files. And then as you said, there’s even some hope for the jQuery issue too: https://github.com/meteor/meteor/issues/6626
