reactjs，bootstrap和npm导入-jQuery未定义

问题描述

我正在尝试在我的react应用中使用引导程序，但这给了我一个错误：Bootstrap的JavaScript需要jQuery 。我已经导入了jquery，并尝试从其他帖子中尝试以下操作：

  import‘jquery’; 
 window.jQuery = $; 
窗口。$ = $; 
 global.jQuery = $; 
  

但是，我仍然得到未定义错误。

解决此问题的唯一方法是放入

  src = https://code.jquery.com/jquery-3.2.1.min.js 
完整性= sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4 = 
 crossorigin = anonymous>< / script> ; 
  

进入index.html

一种导出jquery或使bootstrap能够检测/读取它的方法？

我通过

<$来调用我的bootstrap p $ p> 从'bootstrap'
导入引导程序

解决方案

const bootstrap = require（'bootstrap'）;

我试图用 create-react-app构建一个项目，发现导入模块的加载顺序与导入顺序不同。这就是boostrap无法找到jquery的原因。通常，您可以在这种情况下使用要求。

 从 jquery导入$； 
 window.jQuery = $; 
窗口。$ = $; 
 global.jQuery = $; 
 const bootstrap = require（'bootstrap'）; 
 console.log（bootstrap）
  

相关内容：

进口已悬挂

进口应该先走

from

I'm trying to use bootstrap in my react app, but it gives me aError: Bootstrap's JavaScript requires jQuery. I have imported jquery and have tried tried the following from other posts:

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

However, I still get the not defined error.

The only way to fix this is to put

  src="https://code.jquery.com/jquery-3.2.1.min.js"
  integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
  crossorigin="anonymous"></script>

into index.html

is there a way to export jquery or have bootstrap be able to detect/read it?

I call my bootstrap via

import bootstrap from 'bootstrap'

解决方案

const bootstrap = require('bootstrap');

I tried to build a project with "create-react-app" and found that the loading order of imported modules is not same with importing order. And this is the reason why boostrap can't find jquery. Generally, you can use "require" in this condition. It works on my pc.

import $ from 'jquery';
window.jQuery = $;
window.$ = $;
global.jQuery = $;
const bootstrap = require('bootstrap');
console.log(bootstrap)

Relevant things:

imports are hoisted

https://stackoverflow.com/a/29334761/4831179

imports should go first

from https://github.com/benmosher/eslint-plugin-import/blob/master/docs/rules/first.md

这篇关于reactjs，bootstrap和npm导入-jQuery未定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！