使用Webpack公开jquery插件

我正在尝试使用Webpack。在我的视图文件中，我有以下内容：

define(function (require) {
    require('bootstrap-daterangepicker');

    $('#daterangepicker').daterangepicker({ ... });
});

在

webpack.config.js

中：

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

---

这导致

日期范围选择器不是一个函数

。我看了一下，似乎没有正确导出

$.fn.daterangepicker

。我该怎么做？我曾尝试使用

imports loader

强制导入jQuery，但没有任何帮助。

显然

bootstrap-daterangepicker

尝试加载自己的jQuery。因此，

$.fn.daterangepicker

在“my”jQuery中不可用。我已强制

引导daterangepicker

在webpack.config.js中包含我的jQuery和这一行：

resolve: {
    alias: {
        'jquery': require.resolve('jquery'),
    }
}

---

webpack“resolve”选项对我没有帮助，但是@spacek33z注释让我意识到我的Angular组件的链接元素不是jQuery元素，而是普通的DOM元素。原因是Angular使用了自己的jqLite而不是真正的jQuery

在搜索Angular为什么找不到真正的jQuery时，我发现了一个问题“”，它帮助我实现了Angular的需求

window.jQuery

所以这似乎是适合我的

webpack.conf.js

咒语：

new webpack.ProvidePlugin({
         'jQuery': 'jquery',
  'window.jQuery': 'jquery',
         'jquery': 'jquery',
  'window.jquery': 'jquery',
         '$'     : 'jquery',
  'window.$'     : 'jquery'
}),

---

注意daterangepicker有一行类似于

jQuery=require（'jQuery'）。我有一种感觉，这可能会将插件绑定到错误的jQuery实例。如果您没有绑定jQuery，您应该进行设置。我将如何使用
externals
？我想的是类似于
externals:{'bootstrap daterangepicker'：'$'}
，但不幸的是，这不起作用。如果您只有
externals:{jquery:true}
，它会将jquery视为外部，而不会将其包含在包中。在这种情况下，你的日期采集器将通过它的外观连接到全局。嗯，这不起作用。看起来引导daterangepicker确实使用了正确的jQuery，因为它没有包含在包中。我认为错误纯粹是在导出
$
部分。无论如何谢谢：）。我发现了一些额外的策略。也许其中的一个会起作用。这也解决了我在使用
devbridge autocomplete
时遇到的问题，谢谢你。非常感谢。你救了我一个晚上。为我工作！！应添加到Officel daterangepicker文档中