jQuery not working (ReactJS, Bootstrap, Webpack)

Using a create-react-app ejected project.

I'm following this other stackoverflow answer: Using Jquery and Bootstrap with Es6 Import for React App

The problem is that jQuery isn't working at all in in production mode, even tho Bootstrap doesn't throw the error that jQuery isn't available.

main.js:

// CSS
import 'bootstrap/dist/css/bootstrap.min.css';
import './theme/css/style.css';
import 'font-awesome/css/font-awesome.min.css';

// JS
import 'jquery';
import 'bootstrap/dist/js/bootstrap';

element that uses bootstrap+jquery:

<li id="user-menu" class="dropdown menu-merge pull-right">
  <a aria-expanded="false" class="dropdown-toggle" data-toggle="dropdown">
    <span>User</span>
    <span class="caret ml10"></span>
  </a>
  <ul class="dropdown-menu w225" role="menu">
    <li>
      <a href="/admin/instance">
        <span class="icon icon-Gear mr10"></span>
          Config
      </a>
    </li>
  </ul>
</li>

It simply won't open, unlike using webpack dev config, where it does.

• Webpack's production config file: https://pastebin.com/vb69MRug
• Webpack's development config file: https://pastebin.com/YwE7cuUf

What is going on?