javascript - jQuery 不工作(ReactJS、Bootstrap、Webpack)

Question

使用 create-react-app 弹出项目。

我正在关注另一个 stackoverflow 答案:Using Jquery and Bootstrap with Es6 Import for React App

问题是 jQuery 在生产模式下根本无法工作，即使 Bootstrap 不会抛出 jQuery 不可用的错误。

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';

使用 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>

它根本打不开，不像使用 webpack 开发配置那样打开。

• Webpack 的生产配置文件:https://pastebin.com/vb69MRug
• Webpack的开发配置文件:https://pastebin.com/YwE7cuUf

这是怎么回事？

Answer 1

您的 jQuery 导入不应该是:

import $ from 'jquery'; 而不是 import 'jquery'

为什么不使用 React-Bootstrap反而？这似乎不值得这么麻烦。