can't compile/run rackt todo app example in README

[gknauth]

I did raco pkg install rackt, but when I tried to run node js-build/modules/todoapp.rkt.js I got

(node:5317) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.

BTW "type" : "module" was already in the package.json.

I thought maybe I was supposed to bring rackt's main.rkt in to the same dir as todoapp.rkt and call it rackt.rkt, but that generated a different node error:

node:internal/errors:490
    ErrorCaptureStackTrace(err);
    ^

Error [ERR_MODULE_NOT_FOUND]: Cannot find package 'react-dom' imported from /Users/me/test/rackt/js-build/modules/rackt.rkt.js
    at new NodeError (node:internal/errors:399:5)
    at packageResolve (node:internal/modules/esm/resolve:794:9)
    at moduleResolve (node:internal/modules/esm/resolve:843:20)
    at defaultResolve (node:internal/modules/esm/resolve:1058:11)
    at nextResolve (node:internal/modules/esm/hooks:654:28)
    at Hooks.resolve (node:internal/modules/esm/hooks:309:30)
    at ESMLoader.resolve (node:internal/modules/esm/loader:312:26)
    at ESMLoader.getModuleJob (node:internal/modules/esm/loader:172:38)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:76:40)
    at link (node:internal/modules/esm/module_job:75:36) {
  code: 'ERR_MODULE_NOT_FOUND'
}

Seems like I'm dead in the water. Can't run the example in the README.

[gknauth]

I should clarify, I didn't do raco pkg install rackt, I did what the instructions said, namely,

git clone [email protected]:rackt-org/rackt.git
cd ./rackt
raco pkg install

[gknauth]

The code examples at https://rackt-org.github.io/ obviously work. I'd like to see how that page itself was generated.

[yfzhe]

Rackt (and React) is used to build SPAs (single page application), which are HTML pages with JavaScript running in the browsers. You don't need to use node to run the compiling result. Instead, create an HTML file which "imports" the compiled JS file, and then open it in a browser. This file [link] from rackt-org.github.io repo could be an example.

[leiDnedyA]

I took a look at the example repo and tried it locally, and it looks like it uses Vite.js as a development server and builder for the app. If you look in package.json's "scripts" section, you can see the commands that you can use to run/build the project here:

"scripts": {
    "dev": "vite",
    "build": "vite build",
    "serve": "vite preview"
  }

You can use these scripts by typing npm run <dev, build, or serve> in the terminal. If you use dev or serve, it will set up a development server which will update the page you're working on in real time, or alternatively you can use npm run build, which will create a directory called /dist with static html and js files which can be hosted and run independently.

Hopefully this helps!

*slight correction: vite will update the page live if you edit javascript/html files, but not rkt files, so if you want to edit the page locally you'll have to stop your development server, recompile app.rkt with the racketscript compiler, and then run one of the npm scripts again.