title: React Uncaught SyntaxError: Unexpected token '<' and Manifest: Line: 1, column: 1, Syntax error
body: <p>I am creating React web app from two folders and the dynamic routes within the app return these errors. Static routes work just fine. I get the errors:
  Uncaught SyntaxError: Unexpected token '&lt;'
  manifest.json:1 Manifest: Line: 1, column: 1, Syntax error.</p>
  
  <pre><code>import React, { Component } from 'react';
  import './NavBar.css';
  import Axios from 'axios';
  import { observer } from 'mobx-react';
  import UserStore from '../../src/Stores/UserStore';
  
  class NavBar extends Component {
      constructor(props) {
          super(props);
          this.state = {
              results: {},
              apiLoading: false,
              message: ''
          };
      }
  
      async componentDidMount() {
          try{ //check if the user is logged in
              let res = await fetch('/isLoggedIn', { 
                  method: 'post',
                  headers: {
                      'Accept': 'application/json',
                      'Content-Type': 'application/json'
                  }
              });
  
              let result = await res.json();
  
              if (result &amp;&amp; result.success) {
                  UserStore.loading = false;
                  UserStore.isLoggedIn = true;
                  UserStore.username = result.username;                
              }else{
                  UserStore.loading = false;
                  UserStore.isLoggedIn = false; 
              }
          }
          catch(error){
              UserStore.loading = false;
              UserStore.isLoggedIn = false;
          }  
      }
  
  render () {
  
          if(UserStore.loading) {
              return(
  
                &lt;div&gt;
                  &lt;p&gt;Loading, please wait...&lt;/p&gt;
                &lt;/div&gt;
  
              );
          }else{            
              if(UserStore.isLoggedIn){
  
                  let hrefString = '/account/' + UserStore.username;
                  return(
                      &lt;div className="navigation"&gt;
  
                          &lt;div className="HomeButton"&gt;
                              &lt;a href="/"&gt;&lt;h3&gt;Stock Track&lt;/h3&gt;&lt;/a&gt;
                              &lt;i id="#icon" className="fas fa-globe"&gt;&lt;/i&gt;
                          &lt;/div&gt;
  
                          &lt;div className="NavButtons"&gt;
                              &lt;a href={hrefString}&gt;My Account&lt;/a&gt;
                              &lt;a href="/lessons"&gt;Lessons&lt;/a&gt; 
                          &lt;/div&gt;
  
                      &lt;/div&gt;
                  );
  
              }else{
                  return(
                      &lt;div className="navigation"&gt;
  
                          &lt;div className="HomeButton"&gt;
                              &lt;a href="/"&gt;&lt;h3&gt;Stock Track&lt;/h3&gt;&lt;/a&gt;
                              &lt;i id="#icon" className="fas fa-globe"&gt;&lt;/i&gt;
                          &lt;/div&gt;
  
                          &lt;div className="NavButtons"&gt;
                              &lt;a href="/register"&gt;Register&lt;/a&gt;
                              &lt;a href="/login"&gt;Login&lt;/a&gt;
                              &lt;a href="/lessons"&gt;Lessons&lt;/a&gt;
                          &lt;/div&gt;
  
                      &lt;/div&gt;
                  );
              }
          }
  }
  
  </code></pre>
  
  <p>In the other folder (folder 2) I have this code that effectively joins both folders:</p>
  
  <pre><code>app.get('/*', function(req, res) {
      res.sendFile(path.join(__dirname, 'build', 'index.html'));
  });
  </code></pre>
  
  <p>And this folder contains a router contains: </p>
  
  <pre><code>isLoggedIn(app, db) {
  
          app.post('/isLoggedIn', (req,res) =&gt; {
  
              if(req.session.userID) {
                  let cols = [req.session.userID];
  
                  db.query('SELECT * FROM users WHERE id = ? LIMIT 1', cols, (err, 
                           data, fields) =&gt; { //add cols 
                      if(data &amp;&amp; data.length ===1){
                          res.json({
                              success: true,
                              username: data[0].username
                          });
                          return true;
                      }else{
                          res.json({
                              success: false
                          })
                      }
                  })
              }else{
                  res.json({
                      success: false
                  });
              } 
          });
  
      }
  </code></pre>
  
  <p>In my App.js (folder 1) I have a router that includes:</p>
  
  <pre><code>&lt;Router&gt; 
          &lt;Switch&gt;
  
            {/* This route doesn't return the error */}
  
            &lt;Route exact path="/marketoverview" component={marketOverview} /&gt; 
  
            {/* But this route returns the error */}
  
            &lt;Route path='/account/:username' component={MyAccount}/&gt;
  
          &lt;/Switch&gt;
  &lt;/Router&gt;
  </code></pre>
  
  <p>Thank you for your suggestions</p>