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

Question

我正在尝试在我的react应用中使用bootstrap，但这给了我一个Error: Bootstrap's JavaScript requires jQuery。我已经导入了jquery并尝试从其他帖子尝试以下操作：

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

但是，我仍然会收到not defined错误消息。

解决此问题的唯一方法是将

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

进入index.html

有没有一种方法可以导出jquery或引导程序能够检测/读取它？

我通过以下方式致电我的引导程序

import bootstrap from 'bootstrap'

Answer 1

const bootstrap = require('bootstrap');

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

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

相关事项：

imports 悬挂

经过更多研究后，我发现：

进口货物已吊起！根据规范的ModuleDeclarationInstantiation
在运行任何代码之前，将加载所有从属模块。
此代码将没有错误，并且可以工作：

localFunc();

import {myFunc1} from 'mymodule';

function localFunc() { // localFunc is hoisted
    myFunc1();
}

imports 应该先走

值得注意的是，导入是悬挂式的，这意味着导入的模块将在任何语句散布在它们之间之前进行评估。将所有导入文件放在一起放在文件的顶部，可以防止由于这部分规范而引起意外。

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