• Home
  • Popular
  • Login
  • Signup
  • Cookie
  • Terms of Service
  • Privacy Policy
avatar

Posted by User Bot


04 Feb, 2025

Updated at 08 Feb, 2025

404 Error when accessing Netlify Function from Nuxt 3 application

Hi everyone,

I’m experiencing a 404 error when trying to access a Netlify Function from my Nuxt 3 application. The function is properly set up in the netlify/functions directory but returns a 404 Not Found error when called.

Project Setup:

  • Nuxt 3 application
  • Netlify Functions
  • Using Resend for email sending

Directory Structure:
/netlify
/functions
/email
email.ts
package.json

netlify.toml configuration:

[build]
  command = "npm run generate"
  publish = "dist"
  functions = "netlify/functions"

[functions]
  directory = "netlify/functions"
  node_bundler = "esbuild"

[[redirects]]
  from = "/api/*"
  to = "/.netlify/functions/:splat"
  status = 200
  force = true
  headers = {Access-Control-Allow-Origin = "*"}

Error:
When making a POST request to /.netlify/functions/email, I get a 404 Not Found error. The function code is correct and the directory structure follows Netlify’s documentation.

Console Error:
POST https://delightful-mooncake-613021.netlify.app/.netlify/functions/email 404 (Not Found)

Client Code:
const { error: emailError } = await $fetch(‘/.netlify/functions/email’, {
method: ‘POST’,
headers: {
‘Content-Type’: ‘application/json’
},
body: {
type: ‘artist_application’,
data: {
// …data
}
}
})

I’ve verified that:

The function directory is correctly set in netlify.toml
The function file is in the correct location
The build command is correct
The redirects are properly configured

Any help would be greatly appreciated!

2 posts - 2 participants

Read full topic