Can't understand this uncaught ReferenceError for jQuery

13 views
Skip to first unread message

Derrell Durrett

unread,
May 19, 2015, 5:34:21 PM5/19/15
to spi...@googlegroups.com
I'm very new to Spine, and nothing like an old hand with JS (I am far more comfortable writing snippets of CoffeeScript, but that was deployed in a Rails app).

In any case, loving CoffeeScript, I wanted to try Spine.js, and I've started to try to build an app using it, and yet, if I make only minor changes from the defaults created by spine, the index.html fails to load with "Uncaught ReferenceError: jQuery is not defined" at the reference to jQuery in index.html:

<script charset="utf-8">
 
var exports = this;
 jQuery
(function(){
 
var App = require("index");
 exports
.app = new App({el: $("body")});
 
});
</script>

Note: I haven't yet changed index.html at all from the version created when I ran
'spine app <app-name>'
to get started:
C:\Users\ddurrett\projects>fc test-app\public\index.html VectorUI\public\index.html
Comparing files TEST-APP\PUBLIC\index.html and VECTORUI\PUBLIC\INDEX.HTML
FC
: no differences encountered

What could I have munged? More to the point, when I encounter this problem later how can I debug it? I have no references in the rest of my code to jQuery (though I'd expect I'll want to add some eventually!).

If other information would be helpful, please let me know. I'm kind of at my wit's end trying to use this, but really don't want to start learning yet another framework (especially as Spine.js seems so promising from a structural standpoint).


Thanks in advance,

Derrell

Derrell Durrett

unread,
May 19, 2015, 6:35:49 PM5/19/15
to spi...@googlegroups.com
Also, some searches for solutions to this problem appeared to suggest that the version of Hem could matter. I've now tried to down-rev to 0.2.7, and to reference the git repo directly (the former builds with errors, the latter appears to build fine). In any case, nothing makes the problem better.

Derrell Durrett

unread,
May 20, 2015, 12:05:11 PM5/20/15
to spi...@googlegroups.com
Further investigation shows that (at least some) projects leveraging the jQuery reference in this situation also used jqueryify (see the spine.contacts repo for this). But simply adding 'require('jqueryify') to the script below is insufficient, as 'require()' isn't yet defined.

If anyone knows the shortcut to solving this, I'd be grateful for a hint.

Thanks!

Aaron Eischeid

unread,
May 20, 2015, 4:59:21 PM5/20/15
to spi...@googlegroups.com
Spine.app hasn't been well maintained lately and might be some of the culprit for you. With newer versions of Spine than you will get by default with current spine.app you do not need jquerify (as jquery itself no longer needs to be wrapped in a module for require), but jquery might be missing from your lib directory. I would check that for starters.

Derrell Durrett

unread,
May 21, 2015, 11:07:56 AM5/21/15
to spi...@googlegroups.com
Fair enough (as to the maintenance state). Still, it seems as though it ought to work well enough for what I'm trying to do. I've taken to comparing the behavior of the initial app created by `spine app app-name` to the lightly modified version I'm creating. That comparison hasn't been particularly revealing, since, after I make some very small changes, my version doesn't load. I haven't modified index.html, and lib/jquery.js is still there, but isn't found on page load (though this isn't reported unless I have 'pause on caught exceptions' turned on in the developer's tools console, and hit `escape`.

The most recent attempt to do debug has shown me that there is (without my having created it) an application.js that loads in the 'no changes' case. Any idea how that is? Why isn't it done for once I've made changes by default? How would you approach debugging it?  Running `hem server -d -v` doesn't produce additional output after startup (such as when a connection is requested), so I can't be sure what's up.

Is it possible that I *always* have to run `hem build` to create the application.js?

Thanks for the help.

Aaron Eischeid

unread,
May 21, 2015, 2:45:37 PM5/21/15
to spi...@googlegroups.com
Hmm, seems like you aren't in a situation where you need `hem build` on each change since your app starts to break after changes indicating it is picking up those changes and serving up a new application.js through hem. as to why the application.js file showed up... I am not sure. The version of Hem is far enough away from the one I normally use that I cant say for sure what it might be doing.

I would trace back your changes and see where it started breaking, or alternatively, starting with a new app that works, see if you can make it break in the same way.

I will plan to put some time into spine.app and hem and associated documentation to help make getting started with Spine easier than it has been for you so far.

--
You received this message because you are subscribed to a topic in the Google Groups "Spine" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/spinejs/Uxg6aTb9ygc/unsubscribe.
To unsubscribe from this group and all its topics, send an email to spinejs+u...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Derrell Durrett

unread,
May 21, 2015, 4:52:12 PM5/21/15
to spi...@googlegroups.com
I think I understand where my problem is, now. I was assuming that file uploads would use File/filereader. I think I see from a lot of googling that this assumption fails (prompted by adding them as dependencies to my spine app and getting
"Error: Cannot find module: fs. Have you run `npm install .` ?"
)

(No need to worry about how I got there so incorrectly, I was assuming the file upload stuff would take care of itself once I was ready for it-- I see that was a wrong assumption!)

There seem to be enough tutorials for express and similar node-related tools that I hope to be able to figure it out.

Thanks for your feedback. It was valuable.
Reply all
Reply to author
Forward
0 new messages