Error encountered: SyntaxError - Unexpected '<' token found while trying to add parameters to an express route

Whenever I try to add parameters to my route, I always encounter an error. It seems to mess up the HTML file that I serve and ends up returning a "not found" HTML file instead of the JS file that is supposed to be inside the served HTML file.

app.get('/polls',function(req,res){
res.sendFile(__dirname + "/public/poll.html")
})

The above code snippet works perfectly fine, however, when I try to add parameters like this:

app.get('/polls/:id',function(req,res){
res.sendFile(__dirname + "/public/poll.html")
})

I start encountering errors on the client side. The console displays an error on line 1 of the JavaScript file inside poll.html, but strangely shows line 1 of poll.html in the console as well. You can find the GitHub directory linked here: https://github.com/tienanh2007/Voting-App

Answer №1

To fix the issue, add publicPath: '/', to the output section of your webpack.config.js file.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The console is encountering XML parsing errors while trying to load content from one HTML file into another

I am currently using the latest version of Firefox to locally view my static web page, index.html, as I work on developing it. My approach in organizing my web page content involves having multiple HTML files for easier maintenance and reduced client-side ...

Automatically adjust the height of a React Native view

I am working on a component that consists of three views - one at the top, another in the middle with a specific height, and the last one at the bottom. I want the top and bottom views to adjust their heights accordingly. Although this may seem straightfor ...

The error message "Next.js 14 does not recognize res.status as a function"

I'm a newcomer to Next.js and I've been wrestling with an issue all day. Here's my API for checking in MongoDB if a user exists: import {connect} from '../../../../lib/mongodb'; import User from '../../../models/userModel&ap ...

jqGrid - Error when the length of colNames and colModel do not match!

Whenever I implement the code below, it triggers an error saying "Length of colNames and <> colModel!" However, if isUserGlobal is false, no errors occur. The version of jqGrid being used is 4.5.4 receivedColModel.push({name:'NAME', index: ...

A step-by-step guide to preventing multiple user logins from various tabs within one browser

In my application, it is built with the spring3 MVC framework. I am looking to implement a feature where if a user opens two tabs and tries to login simultaneously using different userIds, they will be redirected back to the same page. I want to achieve f ...

Angular Dom does not update when invoking a function within a separate component

Greetings everyone! I am facing a situation where one component (let's name it recipe component) has a reference to another component (named grocery component). The method in my recipe component uses the reference to the grocery component to call a s ...

The Problem of Restoring Column Height in Tabulator 4.6.3 Filters

The Issue After activating and deactivating header filters, the column height does not return to its original state. Is this the expected behavior? Is there a way to reset the column height? Check out this JS Fiddle example: https://jsfiddle.net/birukt ...

Resources for Learning HTML5, CSS3, and JavaScript

Currently on the hunt for comprehensive resources that delve deep into HTML elements like <audio>, <video>, and <canvas>. I want to explore how JS and CSS/CSS3 can be leveraged to craft interactive graphs/games and illustrations using the ...

The NODE.JS application becomes unresponsive when attempting to retrieve 2.5 million records from an API

I'm facing an issue where my app is retrieving millions of rows from a database and API, causing it to get stuck after calling the getData() function. let closedOrdersStartDate; preparedOrdersPromise = tickApiConnector.obtainT ...

Should I utilize Sockets or Ajax for my project?

My Login Script Journey I have a goal in mind - to create a login script using Nodejs. I am currently exploring the options of utilizing sockets or ajax posts for this task. My Progress So Far I have Nodejs installed and have referenced this code in my ...

Issues are being faced with the execution of JavaScript on Heroku when using Rails 3.1

After upgrading a Rails 3.0 app to 3.1 on Heroku running on the cedar stack, everything seemed fine except for one major issue - the app's JavaScript wouldn't run. Despite the application.js file being compiled and accessible at myapp.com/assets/ ...

The orthographic camera in Three.js offers a unique perspective for rendering

Currently, I am working on a project involving an application that showcases various 3D models. The process involves loading the models, creating meshes, and adding them to the scene as part of the standard procedure. Upon completing the addition of the la ...

What methods can a web server or website use to trigger the re-caching of its own content?

We have recently launched a simple HTML and JS website that requires frequent updates to be reflected to users quickly. However, we are facing challenges with users having to clear their caches. We are exploring options within the HTML file or the Apache w ...

I attempted to initiate a transition using JavaScript, but unfortunately it failed to execute

Hey there! I'm just starting out with HTML, CSS, and JavaScript, and I've been trying to make a transition work using JavaScript. The element I'm working with is a "menu-icon" which is a span tag with a small image nested inside another div ...

Creating an Express.js route that handles requests with various unique IDs

I am currently utilizing node.js with the express library. I have pages like localhost/page/1 and localhost/page/2 which are quite similar, but certain information needs to change based on the page ID. I am redirecting to these pages using a form submissio ...

Leveraging Vue.js to preload data with client-side rendering

When it comes to server-side rendering in Vue, like with Nuxt, the process involves grabbing data using the serverPrefetch() function and rendering content on the server side. This allows for the request to return data to the user only after the initial do ...

Ways to render component solely based on the alteration of the class props

In my ReactJS project, I am fetching JSON data from a RESTful Django host and using it to create a table with filters. Here is my Table class: class MainTable extends React.Component { constructor(props) { super(props); this.state = { res ...

Using AJAX autocomplete with Sys.Serialization.JavaScriptSerializer

I implemented an ajax autocomplete feature in ASP.NET where a method from a web service is called to fetch postal codes. public string[] GetNames(string prefixText, int count, String contextKey) { prefixText = prefixText.Trim(); XmlNodeList list; ...

Steps for removing a click handler from an element and all of its child elements

Is there a way to prevent my #lightbox element from being affected by an event handler attached to the body? $('body :not(#lightbox)').click(function() { $('#lightbox').hide(); }); The Lighbox is positioned in the center. I wa ...

Why is the home page on my jade website showing a blank screen?

Currently, I am following a tutorial on Express, Mongo, and Jade. While I have successfully retrieved data from MongoDB, Jade is not rendering my page correctly. Click here for the tutorial. Here are the snippets of code I am using: app.js: app.get(&apo ...