Include Coffescript generated javascript?

Question

I have the following Coffeescript in test.js

yo () -> console.log("yo")

When compiled via coffee -o public/javascripts/ -cw public/coffeescripts/, I get public/javascripts/test.js:

// Generated by CoffeeScript 1.4.0
(function() {
  var yo;

  yo = function() {
    return console.log('yo');
  };

}).call(this);

I'm trying to include this in the usual way in an HTML file:

<script src="/javascripts/test.js" type="text/javascript"></script>
<script type='text/javascript'>
  //<![CDATA[
  $(function() {
    alert('before yo');
    yo();
    alert('after yo');
  });
  //]]>
</script>

However I keep getting "Uncaught Reference Error: yo is not defined". Whats the process for actually using the javascript generated by Coffeescript?

What's your question? What do you expect to happen? What actually happens? — Shmiddty, Jan 24 '13 at 16:42
possible duplicate of [CoffeeScript & Global Variables](http://stackoverflow.com/questions/4214731/coffeescript-global-variables) — Shmiddty, Jan 24 '13 at 16:45

score 3 · Accepted Answer · answered Jan 24 '13 at 16:45

In your CoffeeScript file, yo is a local variable. It is not a global variable. If you want to use that variable from another JavaScript file or from JavaScript in the HTML file, then you will need to make yo a global variable.

You can do this in the CoffeeScript file like so:

yo = -> ...

# either
@yo = yo
# or
window.yo = yo

score 2 · Answer 2 · edited May 23 '17 at 12:12

2

The generated Javascript from your Coffeescript needs a tweak to export yo outside the calling context.

// Generated by CoffeeScript 1.4.0
(function(context) { // changed this line (note: context == 'this' which is being passed in at last line)
  var yo;

  yo = function() {
     return console.log('yo');
  };

  context.yo = yo; //export yo to the context.

}).call(this);

Commonly, instead of this, will you see people pass in window and/or document when the code is used in the context of a web page (as opposed to server-side Node.js calling context).

I updated the Javascript, but you can have easily used the 'module export' idiom which you can read more about here - Pattern for CoffeeScript modules

edited May 23 '17 at 12:12

Community

1
1

answered Jan 24 '13 at 17:07

mrk

4,999
3
27
42

@yo solution prevented me from tweaking the javascript, but your solution gave me some more background on the underlying issue of the coffeescript module pattern...so I upvoted as well. – Allyl Isocyanate Jan 24 '13 at 18:43
Updating the CoffeeScript and recompiling it is generally preferable to letting the generated file go out of sync with the original source. – yfeldblum Jan 24 '13 at 18:57

Include Coffescript generated javascript?

2 Answers2