Netlify Dev - Links are just redirecting to home page

I am testing out a new lambda function (contact form which calls a netlify lambda function which then calls a sendgrid API to send an email) and experimenting with netlify dev

I will run

npx netlify dev

and I get the below, pointing to port 8888

(node:90308) ExperimentalWarning: queueMicrotask() is experimental.
(node:90308) ExperimentalWarning: The fs.promises API is experimental
◈ Netlify Dev ◈
◈ Injected build settings env var: SENDGRID_API_KEY
◈ Ignored general context env var: LANG (defined in process)
? Multiple possible start commands found Hugo-hugo server -w
Add 'framework = "hugo"' to the [dev] section of your netlify.toml to avoid this selection prompt next time
◈ Loaded function mailer.
◈ Loaded function newsletter_sub.
◈ Functions server is listening on 55706
◈ Starting Netlify Dev with Hugo
Start building sites … 
hugo v0.87.0+extended darwin/amd64 BuildDate=unknown

                   | EN  
-------------------+-----
  Pages            | 29  
  Paginator pages  |  0  
  Non-page files   | 18  
  Static files     | 46  
  Processed images | 40  
  Aliases          |  0  
  Sitemaps         |  1  
  Cleaned          |  0  

Built in 1539 ms
Environment: "development"
Serving pages from memory
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop

By default it’ll automatically open http://localhost:8888/

however, all links I click on the site take me to http://localhost:8888/enter_path_here but simply renders the home page. Thus I’m unable to test any functions because I can’t actually navigate to any of the pages where the function calls are made.

I feel like this might be something related to how I define my relative paths in the Hugo build, but I can’t figure it out.

The site builds fine locally (i.e. when I run hugo server and navigate on the default localhost:1313, and the site works fine on prod)

Thanks

Could you provide your site’s Git repo to test?

It’s a private repo - how would I go about sharing it with you?

You can share it with my GitHub username: Hrishikesh-K

Just added! let me know if you see it

I’m checking your repo and yes, on the initial attempts, that does seem to be an issue. I’d check this and let you know what might be the problem.

1 Like

when you have a chance I’d also love to know if my understanding of netlify functions is correct.

If the dev environment opens on port 8888, I can only call the fetch the function on port 8888, correct? I’ve tried a few others and it just gives me the CORS access issue. I’m asking just so I know not to keep playing around with it until this particular issue is resolved, so I can navigate to the signup module which calls the function

Yes, Netlify Functions would be available only on the port the dev server is running (default: 8888).

About your actual issue, I believe it has something to do with the fact that Netlify Dev is detecting 2 possible servers in your app.

I added a netlify.toml file with the following config:

[dev]
  command = "hugo server"
  targetPort = 1313
  framework = "#custom"

and it works. Could you try this?

It looks like I get the same issue. But to be clear should I be using localhost:1313 or 8888?


(node:90437) ExperimentalWarning: queueMicrotask() is experimental.
(node:90437) ExperimentalWarning: The fs.promises API is experimental
◈ Netlify Dev ◈
◈ Injected build settings env var: SENDGRID_API_KEY
◈ Ignored general context env var: LANG (defined in process)
◈ Loaded function mailer.
◈ Loaded function newsletter_sub.
◈ Functions server is listening on 55953
◈ Starting Netlify Dev with #custom
Start building sites … 
hugo v0.87.0+extended darwin/amd64 BuildDate=unknown

                   | EN  
-------------------+-----
  Pages            | 29  
  Paginator pages  |  0  
  Non-page files   | 18  
  Static files     | 46  
  Processed images | 40  
  Aliases          |  0  
  Sitemaps         |  1  
  Cleaned          |  0  

Built in 1411 ms
Watching for changes in 
...

Environment: "development"
Serving pages from memory
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop
   
   │   ◈ Server now ready on http://localhost:8888   │

You should be going to 8888 - Netlify Dev automatically opens this in the browser.

With the config I shared above, I’m not seeing this issue at all - just rechecked. Are you sure it’s still happening to you?

Yes it is still unfortunately an issue for me.

I run: npx netlify dev, and 8888 automatically opens this.

I tried opening in Chrome, Chrome Incognito, Firefox, and Firefox private browsing. Every link I click just refreshes the home page (even though the URL in the url bar has changedd to reflect the right path)

This is quite bizarre if you are not experiencing this, I wonder if it’s a setup thing on my end? But I couldn’t even fathom what it might be

Edit: Adding on in case it helps, localhost:1313 works just fine. The only issue is the functions are inaccessible on that port

Hi @amtsimplified,

I’m checking this further and there doesn’t seem to be any definite cause that’s causing this issue. It does work for me in some cases like adding the config from above.

I’m also not seeing this in my console, not sure if that’s making any difference.

On a side note, could you add node_modules, resources and public to your .gitignore - not saying that’s causing this, but it seems redundant.

Finally, if it still doesn’t work for you, I might have to pass this on to the CLI team. Would it be okay to share the repo with them?

And yes, it would work fine on 1313 because it’s Hugo’s port and as you say it was always working fine there.

Yes please pass it on the team - I’m still encountering the issue after modifying my .gitignore file.

To be frank, I’m not much of a developer so I’m sure it could be something wrong with my environment configuration. It seems those experimentalwarnings are from outdated nodejs modules?

How would you like me to share access to my repo to the cli team?

If you’re okay with it, I can simply pass them on the local copy I’ve unless you’d want to add them to your Git repo.

I can’t say when they’ll check this, or how many people you might have to add as one of the developers might pick up this issue. So, I’d think the first option is a better one, but if you feel otherwise, let me know.

Yes, feel free to share the local copy. It’s actually quite late in my day but this will be the first thing I check tomorrow morning. thank you!

Hi @amtsimplified,

I was drafting a response to the developers and while doing that, I had an interesting observation. As soon as I delete the public and resources folder and then run netlify dev, the website seems to work fine.

Would you be able to check this when you are back tomorrow? If it still doesn’t work, I’d be happy to pass it on.

Wow… this worked!! THANK YOU SO MUCH

These two folders were created after I did a netlify deploy --prod I believe and I thought that was mandatory for testing/deploying lambda functions but I believe I was mistaken

Great to know that it worked.

I still believe that it should not have made a difference, but that’s that. :grimacing:

Let us know if you’ve more questions.

Of course, will do. I truly appreciate all of your help - I don’t think I would have figured it out otherwise