ES6 classes and scope

help
1

Hey guys,

I tried asking this on StackOverflow, but people started scratching their heads wondering how I was loading these files (people not familiar with Meteor, apparently) :wink:

So, my issue:

Iā€™ve got one file, letā€™s say cat.jsx:

class Cat {
  constructor() {
    this.name = 'Fluffy';
  }
}

And in another file, main.jsx, if I reference Cat I get an error that itā€™s not defined:

cat = new Cat();

How do I make the Cat class globally visible? I want some modularity to my project.

2

I found a workaround. Not sure if this is the way to do it, but this works:

Cat = class Cat {
  constructor() {
    this.name = 'Fluffy';
  }
}
1 Like
3

If you want ā€œmodularityā€, donā€™t make you classes global !

4

respectfully, you canā€™t have globally visible and modular.

if you use webpack, you can use ES2015 modules. If not, use npm modulesā€¦

define
let Cat =ā€¦

then at the end of that file
module.exports = Cat

In a sibling file
{Cat} = require('./cat.js')

5

Sorry, misuse of terms. By modularity I just meant having my class in its own file. I realize that having something modular is the opposite of occupying the global space. :slight_smile:

Doesnā€™t this go against the Meteor way of doing things? (i.e., letting it handle the loading files) Thereā€™s no other way to do this?

6

Meteor isnā€™t tackling modules yet. If you donā€™t want to wait, you gotta make your path :wink:

2 Likes