cli: [Bug]: App dev server not working on latest version of node 18

Please confirm that you have:

  • Searched existing issues to see if your issue is a duplicate. (If you’ve found a duplicate issue, feel free to add additional information in a comment on it.)
  • Reproduced the issue in the latest CLI version.

In which of these areas are you experiencing a problem?

App

Expected behavior

Should work with latest stable version of node (18.18.0 at the moment)

Actual behavior

I started a new project using shopify cli today, I was on node 16.15.0 which was under the minimum required node version for the remix template. I upgraded to the latest stable version which is 18.18.0 currently.

After launching the project I was getting error like Could not reach Remix dev server at tunne_url:port and Error forwarding web request: Error: connect ETIMEDOUT ::1:PORT

After testing a previous project that was working I noticed I was getting the same error now. So I downgraded to node 16.20.2 and now it works.

Other thread where I figured this out: https://github.com/Shopify/cli/issues/3553

Reproduction steps

  1. install latest version of node 18
  2. Run any app using Shopify CLI

Operating System

windows 10

Shopify CLI version (check your project’s package.json if you’re not sure)

3.49.6

Shell

powershell

Node version (run node -v if you’re not sure)

18.18.0

What language and version are you using in your application?

Node 18.18.0

About this issue

  • Original URL
  • State: closed
  • Created 9 months ago
  • Comments: 15 (2 by maintainers)

Most upvoted comments

@O-Connects glad to hear, I also was pulling my hair out on this one.

You can also add delete process.env.REMIX_DEV_ORIGIN; to your remix.config.js above the module.exports code to have a fix that withstands node_module changes. Although it would be nice to see a more robust fix in the future.

This line appears to be the reason it won’t work, because it’s sending unnecessary dev server (HMR) traffic over the tunnel. Deleting that line from my local node_modules fixes the problem.: https://github.com/Shopify/cli/blob/4cceb78b2fd53018f682ccb3bf9014b7967725cc/packages/app/src/cli/services/dev/processes/web.ts#L141

Since the dev server runs on a different port (which may not be forwarded) than the app server, I suggest that the REMIX_DEV_ORIGIN be configurable via CLI flags.

I’m not sure why this issue was closed, since it’s definitely still a problem. The app server can connect, but the Remix dev server, which does hot reloading, tries to connect to /ping over the tunnel, which is incorrect.