Why is my javascript file not recognizing servlet like jsp does?

I have a servlet named like @WebServlet(“/UserServlet”), and when I use action=”UserServlet” on JSP, it recognizes it, but the JavaScript file does not.
File Path Info:
Servlet is located at src/main/java/com.name.controller/UserServlet.
JSPs located at webapp/view/
JavaScript file lcoated at webapp/js/

When I do this:

    fetch('/UserServlet', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: registrationDataJSON
    })
        .then(response => response.json())
        .then(data => {
            // handle success or error response
            if (data.status === 'success') {
                // redirect to home page or display success message
            } else {
                // display error message
                alert(data.message);
            }
        })
        .catch(error => {
            // handle network or server error
            console.error(error);
        });
    return true;
};

This redirects to localhost:8080/UserServlet instead of localhost:8080/ProjectName/UserServlet.

But when I mention full path to servlet like this:
fetch('http://localhost:8080/projectname/UserServlet', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: registrationDataJSON }

Then it works, Is there no way I can make it work simply using the Servlet Name and not full path?