How do I get Backbone-relational working with ES6?

[gegenschall]

I'm trying to get Backbone-relational working with ES6 (I'm using System.js and Babel to transpile). I basically define a Model like so:

export class SomethingModel extends Backbone.RelationalModel {
    relations = [{
        type: Backbone.HasMany,
        key: 'anotherThing',
        relatedModel: AnotherThingModel,
    }]

    constructor(options) {
        super(options);
    }
}

I'm using the model like so:

var model = new SomethingModel();
model.get('anotherThing').add(...);

Now the .get(...) method always returns undefined for any relations that are defined on the model and should've been "initialized"(?). This means that the subsequent .add call isn't working either.
Calling SomethingModel.setup() does not change that, using SomethingModel.build() instead of new-instantiation also does not work.

Is there a way to use Backbone-relational with ES6?

[bpatram]

Hi @gegenschall, we are working on migrating all of our existing code into an es6 and umd friendly package (as seen on the /next branch).

Until then I would suggest creating the following shim:

// relational-shim.js
import Backbone from 'backbone';
import 'backbone-relational';

export default {
  Model: Backbone.RelationalModel,
  Collection: Backbone.Collection,
  HasMany: Backbone.HasMany,
  HasOne: Backbone.HasOne,
  store: Backbone.Relational.store,
  View: Backbone.View
};

Then use it like the following:

import { Model, Collection } from 'relational-shim';

let myModel = Model.extend(...);
let myCollection = Collection.extend({ model: myModel, ... });

[bpatram]

Also, Backbone does not use es6's class concepts. You will need to use the constructor's .extend function. You can read more here: http://backbonejs.org/#Model-extend

[gegenschall]

Ok, thanks for your response. Will use the shims until the next branch is stable.

But still, I was under the impression that I could use the class concept of ES6 (works just fine with vanilla Backbone) and just call the setup() method of my relational models somewhere else?

[bpatram]

@gegenschall I don't think you can use es6 classes with backbone just yet. Here is the discussion over at Backbone jashkenas/backbone#3560 about using es6 classes.

[gegenschall]

Nah, it works just fine if you find a way to navigate around the problem of setting properties like url, model, and such. I've solved this using ES.next's class properties. But that's just an aside...

edit: That is, if you're using babel and the correct transform, which is probably no what you guys are aiming for.

Anyway, thanks for answering. I'll fix this temporarily by using the var Class = BaseClass.extend({...}) paradigm. :)

[zowers]

btw:
there's a nice idea how use ES class with backbone:
jashkenas/backbone#3560 (comment)

class MyModel extends Backbone.Model.extend({
   idAttribute: 'id'
}) {
   // ...
};