React router parametrized routes: SyntaxError: expected expression, got '<'

Question

I have a React-router set up which uses parametrized routes:

<Route path="/comments" comments={comments.commentsArray} component={NewReactElement} />
    <Route path="/comments/:id" component={Comment} />

The error: SyntaxError: expected expression, got '<'

I have researched the error, and found out it was happening when the server tries to get a .js/.css/other file, but is returned HTML beginning with <!DOCTYPE> instead, so I set up the express.static, but when entering URL such as comments/1250, it still returns: SyntaxError: expected expression, got '<'. This is my server setup:

app.use(express.static(__dirname + '/views/webpacked'));
app.listen(5000);

app.get('*', (req, res) => {

    res.sendFile(path.resolve(__dirname, 'views', 'webpacked', 'index.html'));

 });

I have also tried:

app.use('/*/*', express.static(...));

But it did not work, either.

Thank you for advice in advance.

Answer 1

I've got a react/react-router page without any express and got the same error: SyntaxError: expected expression, got '<' which started to appear as soon as I configured a react route other then just root /.

After some experimenting I've figured out that in my index.html there was a link to js file:

  <script src="bundle.js"></script>
</body>
</html>

So, the solution was to add / in the source path:

  <script src="/bundle.js"></script>
</body>
</html>

and the error has gone.

Hope that could help a bit.