3

I am getting an error message in the Firefox console for the simplest possible Konva demo. The HTML page:

<!DOCTYPE html>
<html>
  <head>
    <script src="https://unpkg.com/konva@4.1.0/konva.min.js"></script>
    <meta charset="utf-8" />
    <title>Konva Warning Demo</title>
  </head>

  <body>
    <div id="container"style="width: 800px;height: 600px;" ></div>

    <script>
      var stage = new Konva.Stage({
        container: 'container',
        width: 3000,
        height: 3000,
      });
    </script>
  </body>
</html>

gives me this set of messages in the console:

Expected declaration but found ‘[’.  Skipped to next declaration. 3 konvatest.html
Error in parsing value for ‘width’.  Declaration dropped. konvatest.html
Error in parsing value for ‘height’.  Declaration dropped. konvatest.html

It doesn't give me line numbers, but I'm concerned that the values for width and height may not be getting set. And I don't understand the issue with '[' at all.

If I comment out the declaration of Konva.Stage, the messages go away.

Is this a non-issue or just a peculiarity of Firefox? Or is it something I might be doing wrong in the declaration?

Thanks.

awthird
  • 67
  • 4
  • I don't see any issues with the code. it should work well. And I don't see such errors in Firefox. Probably you can just ignore them. – lavrton Feb 03 '20 at 14:17
  • Thanks. Interesting that you don't see those errors in the console. – awthird Feb 03 '20 at 19:01

1 Answers1

0

  1. Put space between "container"style.

  2. Make sure your script is executed after konva is loaded -- your unpkg link seems to be slow and replacing it by reference to a local copy helped.

  3. To fulfill 2. consider, instead of inline script, to use

       <body><div id="containeer"></div><script src="... konva"><script src="yourscript.js">
  1. (specify the language of the script)
guest
  • 1
  • 1