使用引导的Web包-未定义jquery

请参考以上我的设置。出于某种原因，我在dropdown.js中错误地说“uncaughtReferenceError:jQuery未定义（）

我还在webpack.config.js中包含了以下几行

import $ from 'jquery';
require("./node_modules/bootstrap/dist/css/bootstrap.min.css")
require("./node_modules/bootstrap/js/dropdown.js")
import React from 'react';
import ReactDOM from 'react-dom';
var _ = require('lodash');

但是，没有运气——仍然有jQuery未定义的错误。 有什么想法吗？有人能帮我解决这个问题吗

非常感谢

这会有用的

   plugins: [
    new webpack.NoErrorsPlugin({
        $: "jquery",
        jQuery: "jquery"
    })
]

而不是

global.jQuery = require('jquery');

---

global.jQuery对我不起作用。但我在这里找到了一本有趣的读物：

基本思想是使用webpack“imports loader”。不过，请注意，默认情况下并没有安装它，所以首先要安装（npm install--save imports loader）。在webpack.config中，向加载程序添加以下内容：

import $ from 'jquery';

之后，只需导入jquery和bootstrap，或者像往常一样，导入在“jquery”上扩展的其他插件

---

关于

请使用webpack ProviderPlugin，使用global不是一个好主意

{ test: /bootstrap.+\.(jsx|js)$/, loader: 'imports?jQuery=jquery,$=jquery,this=>window' }

---

要使此代码正常工作，您必须在更改后重新启动节点：

// webpack.config.js
module.exports = {
    ...
    plugins: [
        new webpack.ProvidePlugin({
           $: "jquery",
           jQuery: "jquery"
       })
    ]
};

---

正如@Ro所提到的，不要忘记重新启动节点服务器，否则将不考虑对网页的更改。

我确认，一旦添加这些行并重新启动服务器，错误就会消失。

在Bootstrap 4中，webpack.config.js的更新版本实际上是这样的，因为它依赖于Tether：

这会奏效的

plugins: [
// ...plugins...
new webpack.ProvidePlugin({
  $: "jquery",
  jQuery: 'jquery',
  "window.jQuery": 'jquery',
  tether: 'tether',
  Tether: 'tether',
  'window.Tether': 'tether',
}),
]

它对我起了作用，希望它能帮助安装并使用Bootstrap4.0和Webpack3进行个人下拉式导入

plugins: [ 
     new webpack.ProvidePlugin({
           $: "jquery", 
           jQuery: "jquery"
     })
] 

---

插件或单独导入：

require（“./node\u模块/bootstrap/js/dist/dropdown”）

对

整体导入引导：

require（“./node\u模块/Bootstrap”）

---

参考资料

• 有关导入的Bootstrap 4.0说明

---

谢谢。刚刚把我从执行

window.jQuery=require（'jQuery'）中解救出来

它不是到处都加载jquery吗？只有在执行

导入“jquery”

时，才有办法设置jquery吗？我就是不能让它与VS.net 2017和WebPack 2一起工作……甚至重新启动了整个机器一次，以确保节点完全重新启动。一位同事在做一个不相关的Aurelia原型时，与VS 2017有同样的问题还有Webpack2，这对他也不起作用，所以他不得不破解它。Works。但我必须将加载程序设置为“导入加载程序”，比如：{test:/bootstrap.+\（jsx | js）$/，加载程序：'imports loader？jQuery=jQuery，$=jQuery，this=>window'}你是想链接回这个问题还是其他问题？@sean the bean肯定不想链接回这个问题，谢谢你指出。我编辑了帖子，ant更正了链接。这是我让jQuery作为Kendo UI的依赖项工作的唯一方法。谢谢你没有为我工作。上面的一个已经工作了，不过：它是mu我最好使用ProvidePlugin谢谢。在Laravel mix中尝试了很多其他东西后，这对我来说很有效。Jquery使用webpack会更难吗？不。如果它尝试了，它不会。我必须仔细研究这个页面上的每个解决方案，直到找到这个。MurhafSousli很好的回答小姐：const webpack=require（“webpack”）；

plugins: [ 
     new webpack.ProvidePlugin({
           $: "jquery", 
           jQuery: "jquery"
     })
] 

// webpack.config.js
module.exports = {
    ...
    plugins: [
        new webpack.ProvidePlugin({
           Dropdown: "exports-loader?Dropdown!bootstrap/js/dist/dropdown",
       })