'未捕获的ReferenceError:未使用create-react-app定义jQuery'

时间:2017-01-23 06:03:24

标签: jquery twitter-bootstrap reactjs create-react-app

使用create-react-app构建React应用程序,以便应用程序已准备好服务器。

导入引导javascript插件(例如'affix.js')时,出现错误'未捕获的ReferenceError:jQuery未定义',页面不再加载。

我通过index.js文件导入所有模块,因为使用create-react-app它似乎从index.html文件加载'src'和'link'导入。

我这样导入bootstrap插件: import'bootstrap / js / affix.js'

尝试以下列方式导入jquery,位于index.js文件的顶部,但没有一个正在运行:

  1. 从'jquery'
  2. 导入jquery
  3. 从'jquery',窗口导入jquery。$ = window.jQuery = jquery;
  4. 从'jquery'
  5. 导入jQuery
  6. 从'jquery'
  7. 导入$
  8. import'jquery / dist / jquery.js';
  9. 要求(” ./ node_modules / jquery的/ DIST /的jquery.js')
  10. 有什么想法吗?

3 个答案:

答案 0 :(得分:4)

在此处创建React App维护者。

import $ from 'jquery';

然后使用

$.something()
如果您使用的是jQuery 2.x或更高版本,

应该可以正常

如果它没有提出问题。

在您的示例中,问题可能是您编写了import jquery from 'jquery'但使用jQuery作为变量名称。您应该写import jQuery from 'jquery'(或任何其他名称,只要您始终如一地使用它)。变量名在JavaScript中区分大小写。

答案 1 :(得分:2)

万一有人降落在这里。我使用以下方法解决了'create-react-app'的类似问题:

import jQuery from 'jquery';
window.jQuery = jQuery;

并且为了导入需要jQuery的其他包,你应该在这之后导入这些包,在affix.js的情况下,

require 'bootstrap/js/affix.js';

答案 2 :(得分:0)

您可以在react“ public”文件夹中复制jquery.js文件,并将其导入到index.html文件中