title: Gatsby JS with reactstrap NavbarToggler, DropdownToggle, Modal... not working after `gatsby build`
body: <p>I am trying to use <code>reactstrap</code> with <code>gatsbyJS</code>. </p>
  
  <p>It working perfectly when running <code>gatsby develop</code> but animations (like opening dropdowns, toggle navbar, modal) stop working when I run <code>gatsby build</code> and open the generated <code>index.html</code>: nothing happens when clicking them :(</p>
  
  <p>Simple to reproduce:</p>
  
  <pre><code>gatsby new gatsby-site
  cd gatsby-site/
  npm install bootstrap --save
  npm install --save reactstrap react react-dom
  </code></pre>
  
  <p>Then add <a href="https://reactstrap.github.io/components/navbar/" rel="nofollow noreferrer">navbar</a> and/or <a href="https://reactstrap.github.io/components/modals/" rel="nofollow noreferrer">modal</a> in <code>src/pages/index.js</code> (see code below).
  Then run <code>gatsby develop</code>, everything should work perfectly. 
  Then run <code>gatsby build</code>, once generated open <code>public/index.html</code> and try toggle, dropdown, modal, it do not work anymore :(</p>
  
  <p>Any ideas ? Something to do with jquery or PopperJS ?
  Many thanks</p>
  
  <p><a href="https://i.stack.imgur.com/f9cfe.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/f9cfe.png" alt="enter image description here"></a></p>
  
  <p><code>index.js</code> file:</p>
  
  <pre><code>import React from 'react'
  import Link from 'gatsby-link'
  import 'bootstrap/dist/css/bootstrap.min.css'
  import {
    Collapse,
    Navbar,
    NavbarToggler,
    NavbarBrand,
    Nav,
    NavItem,
    NavLink,
    UncontrolledDropdown,
    DropdownToggle,
    DropdownMenu,
    DropdownItem
  } from 'reactstrap';
  import { Button, Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
  
  class NavbarExample extends React.Component {
    constructor(props) {
      super(props);
  
      this.toggle = this.toggle.bind(this);
      this.state = {
        isOpen: false
      };
    }
    toggle() {
      this.setState({
        isOpen: !this.state.isOpen
      });
    }
    render() {
      return (
        &lt;div&gt;
          &lt;Navbar color="light" light expand="md"&gt;
            &lt;NavbarBrand href="/"&gt;reactstrap&lt;/NavbarBrand&gt;
            &lt;NavbarToggler onClick={this.toggle} /&gt;
            &lt;Collapse isOpen={this.state.isOpen} navbar&gt;
              &lt;Nav className="ml-auto" navbar&gt;
                &lt;NavItem&gt;
                  &lt;NavLink href="/components/"&gt;Components&lt;/NavLink&gt;
                &lt;/NavItem&gt;
                &lt;NavItem&gt;
                  &lt;NavLink href="https://github.com/reactstrap/reactstrap"&gt;GitHub&lt;/NavLink&gt;
                &lt;/NavItem&gt;
                &lt;UncontrolledDropdown nav inNavbar&gt;
                  &lt;DropdownToggle nav caret&gt;
                    Options
                  &lt;/DropdownToggle&gt;
                  &lt;DropdownMenu right&gt;
                    &lt;DropdownItem&gt;
                      Option 1
                    &lt;/DropdownItem&gt;
                    &lt;DropdownItem&gt;
                      Option 2
                    &lt;/DropdownItem&gt;
                    &lt;DropdownItem divider /&gt;
                    &lt;DropdownItem&gt;
                      Reset
                    &lt;/DropdownItem&gt;
                  &lt;/DropdownMenu&gt;
                &lt;/UncontrolledDropdown&gt;
              &lt;/Nav&gt;
            &lt;/Collapse&gt;
          &lt;/Navbar&gt;
        &lt;/div&gt;
      );
    }
  }
  
  class ModalExample extends React.Component {
    constructor(props) {
      super(props);
      this.state = {
        modal: false
      };
  
      this.toggle = this.toggle.bind(this);
    }
  
    toggle() {
      this.setState({
        modal: !this.state.modal
      });
    }
  
    render() {
      return (
        &lt;div&gt;
          &lt;Button color="danger" onClick={this.toggle}&gt;{this.props.buttonLabel}&lt;/Button&gt;
          &lt;Modal isOpen={this.state.modal} toggle={this.toggle} className={this.props.className}&gt;
            &lt;ModalHeader toggle={this.toggle}&gt;Modal title&lt;/ModalHeader&gt;
            &lt;ModalBody&gt;
              Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
            &lt;/ModalBody&gt;
            &lt;ModalFooter&gt;
              &lt;Button color="primary" onClick={this.toggle}&gt;Do Something&lt;/Button&gt;{' '}
              &lt;Button color="secondary" onClick={this.toggle}&gt;Cancel&lt;/Button&gt;
            &lt;/ModalFooter&gt;
          &lt;/Modal&gt;
        &lt;/div&gt;
      );
    }
  }
  
  const IndexPage = () =&gt; (
    &lt;div&gt;
      &lt;NavbarExample /&gt;
      &lt;ModalExample buttonLabel="Launch Modal" /&gt;
      &lt;h1&gt;Hi people&lt;/h1&gt;
      &lt;p&gt;Welcome to your new Gatsby site.&lt;/p&gt;
      &lt;p&gt;Now go build something great.&lt;/p&gt;
      &lt;Link to="/page-2/"&gt;Go to page 2&lt;/Link&gt;
    &lt;/div&gt;
  )
  
  export default IndexPage
  </code></pre>