ES6 Class is not a function when imported via System

Question

how come Game is not a function when imported via System

import Core from 'gameUnits/Core' 

export class Game { 
constructor() {

core:

export class Core {
    constructor(scene) {
    }
}

etc

and in the browser:

     <script src="bower_components/traceur/traceur.js"></script>
  <script src="bower_components/es6-module-loader/dist/es6-module-loader.js"></script>
  <script>
    System.import('Game').then(function (Game) {
      game = new Game();
    });
  </script>

`export default class Game {...}` might be more useful. Instead of a `Module` type object with a `Game` property, it exports `Game` directly. — Sean McMillan, Jan 21 '15 at 18:56

score 3 · Accepted Answer · answered Dec 31 '14 at 10:01

3

The module object in your case isn't Game, it contains Game. Try:

System.import('Game').then(function ({Game}) {
  game = new Game();
});

answered Dec 31 '14 at 10:01

Andreas Rossberg

34,518
3
61
72

What does {Game} actually mean? – SuperUberDuper Dec 31 '14 at 12:33
@SuperUberDuper, it destructures the argument object, extracting the property `"Game"` and binding it to a variable of the same name. Same effect as naming the parameter `x` and binding `let Game = x.Game`. – Andreas Rossberg Dec 31 '14 at 13:11
is this a feature of es6? – SuperUberDuper Dec 31 '14 at 13:49
@SuperUberDuper, yes. – Andreas Rossberg Jan 01 '15 at 08:20
1

chrome doesn't like is: **Uncaught SyntaxError: Unexpected token {** – SuperUberDuper Jan 01 '15 at 20:11
@SuperUberDuper, because Chrome doesn't implement destructuring yet (neither modules, for that matter). – Andreas Rossberg Jan 01 '15 at 20:45
oh, I thought traceur took care of that – SuperUberDuper Jan 01 '15 at 23:21
for some reason when I do **var sphere = new Core();** I see Core is undefined, even though I import it – SuperUberDuper Jan 01 '15 at 23:28

ES6 Class is not a function when imported via System

1 Answers1