Kitamado
Kitamado10mo ago

migrate from node to deno: p5js project

Hi, I want to rewrite my p5js project built with nodejs in deno. Here is my code: https://github.com/Seasawher/p5js I would like to preview it using VSCode's liverServer extension. I am a beginner and do not know how to rewrite it in deno. Any advice would be appreciated.
GitHub
GitHub - Seasawher/p5js: WIP: work in progress
WIP: work in progress. Contribute to Seasawher/p5js development by creating an account on GitHub.
12 Replies
Birk Skyum
Birk Skyum10mo ago
Hi @seasawher , when this ticket is resolved https://github.com/denoland/deno/issues/20613, you should be able to simply do deno task dev, and maybe make small correction to the package.json/deno.json. Deno is great at server stuff, but it's still lacking a lot of npm/node compat in the frontend space. Not sure if there's some deno-native api's you can use for this instead, since the deno run and deno bundle doesn't accept a .html file in the same was Parcel does.
GitHub
Issues · denoland/deno
A modern runtime for JavaScript and TypeScript. Contribute to denoland/deno development by creating an account on GitHub.
Kitamado
Kitamado10mo ago
@birkskyum Thanks for your reply. Does this mean that it is impossible to run p5js with just deno until the issue is resolved? I would like to migrate from nodejs, even if the code structure changes a bit.
Birk Skyum
Birk Skyum10mo ago
No, it's possible to use these things together. Here's i.e. a setup with p5 / vitejs running with deno. https://github.com/birkskyum/deno-p5-vanilla
GitHub
GitHub - birkskyum/deno-p5-vanilla
Contribute to birkskyum/deno-p5-vanilla development by creating an account on GitHub.
Kitamado
Kitamado10mo ago
Thank you very much!!!
Kitamado
Kitamado10mo ago
It works fine locally, but not where I deployed it with deno deploy. What did I do wrong? Here is my code:https://github.com/Seasawher/game-of-life deploy to: https://seasawher-game-of-life.deno.dev/
GitHub
GitHub - Seasawher/game-of-life: Conway's game of life. WIP 🚧: work...
Conway's game of life. WIP 🚧: work in progress. Contribute to Seasawher/game-of-life development by creating an account on GitHub.
Kitamado
Kitamado10mo ago
Thank you very much. However, even after the merge of your PR, deployment still does not seem to be working. Locally, it still works correctly. In the developer tools, the following error message appears in the deployed environment.
Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "". Strict MIME type checking is enforced for module scripts per HTML spec.
Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "". Strict MIME type checking is enforced for module scripts per HTML spec.
Birk Skyum
Birk Skyum10mo ago
Right, it could be a missing file extension. In index.tsx, try importing "./constants.ts"; instead of "./constants"; It's mentioned here that the .ts is required: https://github.com/denoland/deno/issues/2506#issuecomment-501223236 Hope that helps
Kitamado
Kitamado10mo ago
Thank you very much. I changed the file extension, but it still doesn't seem to be working. The error message has not changed either. my code is here: https://github.com/Seasawher/game-of-life
GitHub
GitHub - Seasawher/game-of-life: Conway's game of life. WIP 🚧: work...
Conway's game of life. WIP 🚧: work in progress. Contribute to Seasawher/game-of-life development by creating an account on GitHub.
Birk Skyum
Birk Skyum10mo ago
Very annoying. Deno unfortunately isn't mature for frontend stuff yet
NDH
NDH10mo ago
There is hardly anything there. Why not just use a canvas and a 2Dcontext?
Kitamado
Kitamado10mo ago
Thanks for taking the time to think about this... anyway. Any ideas? Please tell me more about it.