0

I am trying to make a basic test program for paper.js, which I intend to use for a project. I am using chrome to run the HTML and when I open the dev tools chrome seems to simply not load one of my scripts. My file structure is:

Test
|---mario.svg
|---html.html
|---scripts/
|   |---script.js
|   |---paper-core.js

And here is my code:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <script src="./scripts/paper-full.min.js"></script>
    <script type="text/paperscript" src="./scripts/script.js" canvas="myCanvas"></script>
</head>
<body>

<canvas id="myCanvas" width="200" height="100"
style="border:1px solid #d3d3d3;">
</canvas>
</body>
</html>

veiw.onFrame = function(event){
    project.importSVG('.../mario.svg');
};

In the chrome dev tools however, under sources, I would expect to see something that matches my file structure, and I do, except script.js is missing. Also it gives me this error: Access to XMLHttpRequest at 'file:///C:/Users/jacob/Documents/JS/Testing/scripts/script.js' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, chrome-untrusted, https. ht @ paper-full.min.js:32

I think it must be something to do with the text/paperscript, but I really don't know and definately don't know how to fix it. I've looked at examples and can't figure out what I am doing differently. The mario.svg doesn't show up either but I think that's just because its not referenced in the html. Can someone explain this please?

sideshowbarker
  • 81,827
  • 26
  • 193
  • 197
Jacob
  • 135
  • 2
  • 12
  • 1
    Have you tried it without "text/paperscript" type? – tromgy Apr 09 '22 at 16:06
  • Yes, I have had better luck with it recognising files with just text/javascript. But I need it to be a paperscript – Jacob Apr 09 '22 at 16:42
  • Do you see any errors in the console? – tromgy Apr 09 '22 at 19:48
  • No. At one point it was giving me an error saying one of them was blocked by CORS, but I can't remember wether it was paper or my script and I can't remember what I did to fix it – Jacob Apr 10 '22 at 10:32

1 Answers1

1

At first sight, I would say that your PaperScript code is not run because you load the wrong version of Paper.js.
You are loading paper-core.js which is the version of Paper.js that does not support PaperScript. You should load paper-full.js instead.

sasensi
  • 4,610
  • 10
  • 35
  • Thanks, good to know, but now it gives me an error: Access to XMLHttpRequest at 'file:///C:/Users/jacob/Documents/JS/Testing/scripts/script.js' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, chrome-untrusted, https. ht @ paper-full.min.js:32 Do you know what origin 'null' means? – Jacob Apr 11 '22 at 08:55
  • I think that I see what this is about. I guess that you are loading your page by opening your html directly in your browser right ? If so, you will encounter lots of issues like this one, you should use a simple web server instead and load your page accessing its URL. Have a look at https://www.npmjs.com/package/http-server for example. – sasensi Apr 12 '22 at 12:18
  • @sesensi Thank you so much, I am actually using pythons http.server now but this page finally showed me what url I should be typing into my browser, I've tried with python before but I never knew what to type for the url – Jacob Apr 12 '22 at 17:06