CODEWITHSUNDEEP
javascripteaseljscreatejs
starscape
starscape

Reputation: 2973

I get the error "createjs is not defined" even though I linked to the file

Here I have a very simple script. 

stage = new createjs.Stage("myCanvas");

circle = new createjs.Shape();
circle.graphics.beginFill("red").drawCircle(0,0,40);

And my HTML

<!DOCTYPE HTML>

<html>
<head>

<link rel="stylesheet" type="text/css" href="mainStyle.css">
<script src="mainScript.js"></script>
<script src="create.js"></script>

</head>
<body>  

    <canvas id="myCanvas" width=1000 height=500 ></canvas>

</body>
</html>

Yet it does not work. I get this error:

"createjs is not defined"

But in my HTML it is linked to file. Is there anything else that could be causing this?

Upvotes: 2

Views: 8199

Answers (3)

JoachimR
JoachimR

Reputation: 5258

For angular projects the above answers might not be sufficient to solve the problem. What I did:

myAngularModule.service('preloadservice', function ($rootScope) {

  if (typeof createjs === 'undefined') {
    setTimeout(continueAfterWait, 500);
  } else {
    continueAfterWait();
  }

  var continueAfterWait = function () {
    var queue = new createjs.LoadQueue();
    //...
  } 
}

Upvotes: 0

Jesse Lee
Jesse Lee

Reputation: 1301

There are a couple problems with your code.

First, and to directly answer the question, you have to load the library which constructs the createjs object before you load your script which instantiates it. Change the order of the script tags you have in your head.

Second, your instantiation will execute before the canvas element is added to the DOM. To fix this you need to listen for the document's onload event. Then execute your code.

Third, to get the red circle object to actually show up you need to append it to the canvas and then call the stages update method.

Ex:

window.onload = function(){
    stage = new createjs.Stage("myCanvas");

    circle = new createjs.Shape();
    circle.graphics.beginFill("red").drawCircle(0,0,40);

    stage.addChild(circle);

    stage.update();
}

Upvotes: 4

sachleen
sachleen

Reputation: 31131

<script src="create.js"></script>
<script src="mainScript.js"></script>

Your code needs to execute AFTER including create.js - order matters.

Upvotes: 5

Related Questions