After setup using Deno template: "WebSocket connection to 'ws://localhost:8002/socket' failed:"

[gr2m]

What version of Remix are you using?

2.0.1

Are all your remix dependencies & dev-dependencies using the same version?

• Yes

Steps to Reproduce

npx create-remix@latest --template remix-run/remix/templates/deno
# apply defaults, cd into new directory
npm run dev

Tested in latest Chrome (118.0.5993.70) on Mac OS 13.6

I went trough past issues that reported similar problems

• Error console WebSocket connection to 'ws://localhost:59765/socket' failed: Remix dev asset server web socket error: #3197
• Console error: WebSocket connection to 'ws://localhost:53317/socket' failed #3193
• Remix dev asset server web socket error #2958

I tried replacing <LiveReload /> with <LiveReload port={8002} /> and adding <meta httpEquiv="Content-Security-Policy" content="connect-src ws://localhost:8002;" />, but it made no difference.

Expected Behavior

no warning.

I also see these logs in the terminal

Watcher File change detected! Restarting!
Import map diagnostics:
  - Invalid top-level key "comment". Only "imports" and "scopes" can be present.
  - Invalid address "" for the specifier key "// `@remix-run/deno` code is already a Deno module, so just get types for it directly from `node_modules/`".

Actual Behavior

[wearypossum4770]

Edit: I did some stuff, now it works. I think the version of Remix I was using caused issues.

I also get this when I use the instructions for react at this tutorial
Indie Stack

This is the error I am experiencing.

This is my uname information

[codyarose]

I ran into the same issue right after finishing up the migration to v2.

• not using deno
• still on cjs
• deploying to vercel
  (if any of that matters)

Adding this to my remix.config.js seems to have fixed the console errors:

dev: {
	port: 8080,
},

I haven't specified a custom port anywhere else

[web-dahuyou]

I have encountered this situation before, and then I tried many ways, and finally solved it in an unconventional method. If you have tried various conventional methods but have not yet resolved them, you can try the following methods:
1、Attempt to clear browser cache data, maybe it' OK
2、Attempt to restart your browser, and try again
3、Try changing to other browser

[vanpelt]

In my case the dev server was listening on port 3001. Adding the following to remix.config.js fixed live reloading:

  dev: {
    port: 8002,
  }

[oslavdev]

Happened to me when I migrated to vite plugin. Removing <LiveReload/> component helped fixing the issue.