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?
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.