Getting error: "Error occurred while trying to proxy: localhost:3000/"

sage
1

Following advice from this thread, I tried multiple versions of Node (16x, 18x) to no avail.

Bud.config.js:

app
    .setUrl('http://localhost:3000')
    .setProxyUrl('http://example.test')

My setup is Windows 10, WSL. Not using Docker/Vagrant or anything like that.

Package.json: “@roots/sage”: “6.12.2”, after downgrading SASS following advice from this thread.

Why is http://localhost:3000 (or http://example.test) not working?

2

what are using for local dev environment, Local WP, valet?

Can you also post entire Package.json

3

Yes local WP.

Package.json:

{
  "name": "sage",
  "private": true,
  "browserslist": [
    "extends @roots/browserslist-config"
  ],
  "engines": {
    "node": ">=16.0.0"
  },
  "type": "module",
  "scripts": {
    "dev": "bud dev",
    "build": "bud build",
    "translate": "yarn translate:pot && yarn translate:update",
    "translate:pot": "wp i18n make-pot . ./resources/lang/sage.pot --include=\"app,resources\"",
    "translate:update": "wp i18n update-po ./resources/lang/sage.pot ./resources/lang/*.po",
    "translate:compile": "yarn translate:mo && yarn translate:js",
    "translate:js": "wp i18n make-json ./resources/lang --pretty-print",
    "translate:mo": "wp i18n make-mo ./resources/lang ./resources/lang"
  },
  "devDependencies": {
    "@roots/bud": "6.12.2",
    "@roots/bud-sass": "^6.12.3",
    "@roots/bud-tailwindcss": "6.12.2",
    "@roots/sage": "6.12.2",
    "sass": "1.62.1"
  },
  "dependencies": {}
}
4

In the past I found issues if the roots packages are not the same version, so try downgrading
@roots/bud-sass to 6.12.2 to match. Also if you switch to a standard wp theme like twentytwentythree, is http://example.test reachable then? Try to eliminate local WP as the issue first.

5

Thanks, I downgraded bud-sass to bring it to the same version as bud, bud-tailwindcss and sage by doing yarn upgrade @roots/bud-sass@6.12.2

My package.json now:

"devDependencies": {
    "@roots/bud": "6.12.2",
    "@roots/bud-sass": "6.12.2",
    "@roots/bud-tailwindcss": "6.12.2",
    "@roots/sage": "6.12.2",
    "sass": "1.62.1"
  },

But now yarn dev triggers a fatal error:

Screenshot_1
Screenshot_11346×901 55.7 KB

I have spent over a full day trying to merely install a new, default Sage project - every single step was a big issue. Am I incredibly unlucky or?

6

Your screenshot isn’t running yarn with WSL.

7

This was only visible in the excerpt shared from the embed on this thread… but there is an invisible character in your TLD just after test

You can kinda see it with the extra space, but it is otherwise invisible to the human eye.

EDIT: Oh wait, maybe that isn’t an invisible character, but perhaps formatted fancy quote?
Might not be the real issue. but caught my eye.

1 Like
8

Yes it’s WSL console, see logo top left:

Screenshot_1
Screenshot_11341×526 48.5 KB

@EHLOVader nah it’s not present when viewing bud.config.js in Sublime.

9

upgrade your node version, you see the error , engine node is incompatible with this module.

10

Installing Sage | Sage Docs | Roots use Volta to install Node LTS.

11

Thanks!

I installed Volta, and then doing yarn dev yielded:

Volta error: Yarn is not available. Use volta install yarn to select a default version (see volta help install for more info).

So I did volta install yarn and then tried yarn dev again, which yielded this error:

Internal Error: sage@workspace:.: This package doesn’t seem to be present in your lockfile; run “yarn install” to update the lockfile

So I did yarn install and got this:

Screenshot_1
Screenshot_11042×484 48.7 KB

Any idea how to fix this?

12

Not sure, but first thing i would try is:

  • deleting the sage node_modules folder
  • run yarn cache clean
  • run yarn install
  • run yarn build
  • run yarn dev

Its may not help but at least the node modules are clean install on new node and yarn version.

13

You were right about that: the error featured in my last message is gone after this clean up, thanks!

But the original problem persists. I’m still getting Error occurred while trying to proxy: localhost:3000/

14

Are you running Local from WSL?

https://community.localwp.com/t/local-via-wsl2-gui-is-much-faster-than-windows-10-native/25414

15

Yes, doing everything from WSL.

16

can you reach http://example.test at least?

17

check to see if port 3000 in use: Analyze the output: If port 3000 is in use, you will see a line that shows the local address with the port number and the corresponding process ID (PID) on the right side.

netstat -ano | findstr :3000
18

Maybe try using .serve('http://0.0.0.0:3000') in bud.config

19

http://example.test is worse than localhost:3000/ as it yields some “This site can’t be reached” error. Like a complete 404.

Can’t do netstat -ano | findstr :3000 on WSL as findstr isn’t available and I can’t see how to install it.

But I tried to change the port from 3000 to 4000 in bud.config (.setUrl('http://localhost:4000')) and I’m getting the same result when visiting localhost:4000/ than with 3000.

So I guess that’s not the port.

.serve('http://0.0.0.0:3000') didn’t help either.

20

If you cant even reach http://example.test then its not bud, its your Local WP. Can you reach other sites on your Local WP?