Import/export collection usage

help
#1

I have a imports/api/messages/client_api.js file that has:
import { Messages } from './messages.js'; import './client/methods.js';

then my main.js file:

import { Meteor } from 'meteor/meteor';
import { Roles } from 'meteor/alanning:roles';
import { Markdown } from 'meteor/markdown';

import moment from 'moment';

import '../imports/api/messages/client_api.js';

I am getting Messages is not defined

Does that not make Messages available to my helper? Do I have to add import { Messages } from '../imports/api/messages/messages.js' in every js file that I want to use Messages in?

#2

I guess in other words, if you export a variable do you have to put it in every single file that you want to use it in? Would I have to import { Meteor } in every file I want to use it in even if I imported it in my main.js file?

#3

Yes, you would have to import it in every file you want to use it with. With ES2015 modules every file is considered a module. To get things out you have to export them, to get things in you have to import them. Check out the Modules chapter of the Exploring ES6 book for more info (waaaay more info than you’ll want to know actually :slight_smile: ).

#4

Thanks so much for the reply! This is confusing at first, especially when import { Meteor } from 'meteor/meteor' seems to work, but that’s because it’s still backwards compatible. I’m going to read through that whole Modules chapter, thank you!

#5

Also, is there a way to “turn off” this backwards compatibility in Meteor, such that I know this will work once imports are required?

#6

Another followup question if anyone could answer.

Messages is now available to my page, but it seems that it’s no longer global. As in, I can’t do messages.find().fetch() in the browser console. It also appears that the latency compensation is gone and it’s making a round trip call to the server before updating the view. If you import collections this way, are they still loaded in the browser db?