I have a presentational component called Navbar.jsx that returns another presentational component based on whether the user is authenticated or not. When I run webpack, I am getting an error saying that the "if" in my if statement is an unexpected token. You'll see the if else statement in the navbar-collapse div. Here is Navbar.jsx:

```
import React, {PropTypes} from 'react';
import PreAuthNavTabs from './PreAuthNavTabs';
import PostAuthNavTabs from './PostAuthNavTabs';

const Navbar = ({ activeUser, loginUser }) => {

    return (
        <div>
            <div className="navbar navbar-default navbar-fixed-top" role="navigation">
              <div className="container">
                <div className="navbar-header">
                    <button type="button" className="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span className="sr-only">Toggle Navigaton</span>
                        <span className="icon-bar"></span>
                        <span className="icon-bar"></span>
                        <span className="icon-bar"></span>
                    </button>
                    <Link to="/inventory"><img className="navbar-brand" src='../../css/hello_bacsi.png'></img></Link>
                </div>
                <div className="navbar-collapse collapse">
                            {
                                if (activeUser) {
                                    return <PostAuthNavTabs activeUser={activeUser} />;
                                } else {
                                    return <PreAuthNavTabs loginUser={loginUser} />;
                                }
                            }
                </div>
              </div>
            </div>
            </div>
    );

};

Navbar.propTypes = {
    activeUser: PropTypes.object,
    loginUser: PropTypes.func
};

export default Navbar;

```
['https://Stackoverflow.com/questions/37933403', 'https://Stackoverflow.com', 'https://Stackoverflow.com/users/5264835/']
There is no silver bullet. [Different HTML parsers behave differently](https://www.crummy.com/software/BeautifulSoup/bs4/doc/#differences-between-parsers) and you should pick the one that works for your particular page. Works in this case basically means, that you can get to your desired data. 

`lxml` parser is generally faster, `html5lib` is the most lenient one - this kind of difference would be relevant if you have a broken or non-well-formed HTML to parse. `html.parser` is built-in and can help to avoid extra dependencies, if this is a problem. Here is a [related table](https://www.crummy.com/software/BeautifulSoup/bs4/doc/#installing-a-parser) that highlights the differences.
I've learned it the hard way. It's been killing me. I just couldn't figure out why the tag I wanted included something that wasn't in that tag. Turned out the html parser wasn't working correctly with that site. After hours of headache, I suddenly tried switching to lxml parser, and lo and behold... The unwated stuff was gone as it should have been!