Parse.View.extend - "cannot read property 'extend' of undefined"

Question

Currently using the Parse JavaScript SDK for a web app, but I'm also new to Backbone, and since this particular problem is in functionality that Parse copied over from Backbone, I'm not sure exactly where I'm making my mistake.

I have index.html, with this basic structure & script template tag (to be used by _underscore):

<div id="my-app">        

</div>
<script type="text/template" id="album-header-template">
    <div id="some-id">
          Some Content
    </div>
</script>

At the end of <body>, the following script tags, to take care of Parse dependencies, load Parse, & use my own JS file:

<script src="libraries/node_modules/jquery/dist/jquery.min.js"></script>
<script src="libraries/node_modules/underscore/underscore-min.js"></script>
<script src="libraries/node_modules/parse/dist/parse-latest.min.js"></script>
<script src="app/ParseApp.js"></script>

Then in ParseApp.js, where I am trying to get off the ground by creating simple objects and views, I have the following:

$(function () {
    var Album = Parse.Object.extend("Album",{
            // Default attributes for the album
            defaults: {
              name: "Album Title"
            },

            // Ensure that each album created has a title
            initialize: function() {
              if (!this.get("name")) {
                this.set({"name": this.defaults.content});
              }
            },
        });

    var HomeView = Parse.View.extend({
        el: $("#my-app"),

        initialize: function() {
            console.log("new instance of HomeView");
            this.render();
        },

        render: function() {
            this.$el.html(_.template($("#album-header-template").html()));
        }
    });

    new HomeView;
});

When I run index.html in the browser, I get the following error in console: Uncaught TypeError: Cannot read property 'extend' of undefined (occurring at the var Home View = Parse.View.extend line).

Originally, I had thought this might be because Parse wasn't initiated in time for ParseApp.js to use it, based on my scripts loading. However, I ran the recommended "Test the SDK" script from Parse, and it's indeed initialized (in addition, adding an object with var Album works fine). So I'm really stuck on what's causing either HomeView or Parse.View to be "undefined".

Likely a straightforward answer that I'm overlooking, but any help would be greatly appreciated, and I could provide full files if need be.

`Cannot read property 'extend' of undefined` - essentially it is saying that `Parse.View` is not a thing. You can send it to console to check if it is. — Yura, Oct 27 '15 at 16:27
Thanks, that's a great summary. And I did just run `Parse.View` in the console, and got `undefined`. Now I need to figure out why only some Parse methods are working, though - `Parse.Collection` and `Parse.Router` (both of which work in the [example Todo app](https://github.com/ParsePlatform/Todo) I reference), but `Parse.Object` and `Parse.User` both return their correct functions. Would love to hear thoughts on what could be causing only partial functionality with the Parse SDK. — Jack Koppa, Oct 27 '15 at 16:45
EDIT: `Parse.Collection`, `Parse.Router`, and `Parse.View` are all **not** working right now, and returning `undefined` — Jack Koppa, Oct 27 '15 at 16:55
Then, have a look at the Network panel in the browser console to check if the library is even loaded. — Yura, Oct 27 '15 at 16:56
@JackKoppa did you ever determine the cause of the issue? I'm having a very similar issue right now. Thanks! — K_C, Nov 03 '15 at 21:49
Can you please post your solution? No offense, but it's very rude to ask all of us for help and then never return with your solution to help out our community. I'm having the same exact issue with Parse.Collection and would love to hear what you've discovered. — Chad, Nov 06 '15 at 20:23
As mentioned in other SO questions, Parse no longer contains Backbone behavior as of V1.6.0 (http://stackoverflow.com/questions/32722575/how-do-i-implement-the-backbone-model-in-latest-parse-js-sdk-1-6-2) — Daniel Bank, Nov 07 '15 at 16:35
Sorry for the delay, everyone - as @DanielBank mentioned, discovered that the most recent versions of Parse no longer include default Backbone behavior. Had missed that in the docs. Fixed the problem by specifically loading Parse 1.5.0 from npm. Obviously, that doesn't really fix the problem, so I now have to review how to move forward. Not sustainable to rely on an older version of Parse, but also very difficult to change app structure completely. — Jack Koppa, Nov 08 '15 at 01:46

score 3 · Accepted Answer · answered Nov 08 '15 at 03:09

Not a very satisfying answer, but thanks to the help from @Yura & @Daniel Blank, discovered that the error was resulting because the most recent versions of the Parse SDK (everything after 1.6.0) no longer include full Backbone functionality. This includes the version I had been using locally from npm.

The best explanation of the Parse SDK direction is in the link given above, and there seem to be three options, for those hoping to continue using Parse and/or Backbone:

Use an old version (1.5.0 being the most recent that includes Backbone functionality) in order to maintain your Backbone functions, such as Parse.Collection or Parse.Router.
Try going Parse SDK-agnostic, while continuing to use Backbone. Can use the basic Parse REST API, or try one of the GitHub projects attempting to do that linking for you.
Give up on Backbone going forward, and use Parse with VanillaJS, or perhaps switch over to React (which is obviously the direction Facebook would want Parse to head)

I'm too inexperienced to recommend one of the three, although #1 seems the easiest, while #3 seems far and away the most maintainable. Still trying to make my own decision, but that's outside the scope of my original question. Thanks for the help, everyone.

Low reputation = limited links, but here's [the explanation link](http://stackoverflow.com/questions/32722575/how-do-i-implement-the-backbone-model-in-latest-parse-js-sdk-1-6-2) I mentioned — Jack Koppa, Nov 08 '15 at 03:10

score 0 · Answer 2 · answered Nov 07 '15 at 05:16

2 things jump out at me:

I don't see where you initialize Parse... typically that produces a different error, but still might be an issue
You are referencing your own local library for Parse... maybe try targeting the officially deployed version.

script src="http://www.parsecdn.com/js/parse-1.2.13.min.js"

Parse.View.extend - "cannot read property 'extend' of undefined"

2 Answers2