如何将Select2与WebPack一起使用

Question

我已经下载了select2作为节点模块：

npm install select2

并将其包含在我的app.js中：

require('select2')($);

---

当我运行webpack时，没有错误，但是当我打开应用时，我会得到：

Uncaught TypeError: Object.defineProperty called on non-object(…)

来自select2.js：

S2.define('select2/core',[
  'jquery',
  './options',
  './utils',
  './keys'
], function ($, Options, Utils, KEYS) {
(...)
}

发生的原因是select2的模块包装器仅适用于AMD，并且与commonjs不兼容？

Answer 1

您在哪里看到的是如何使用select2？据我所知，从浏览该项目中，您需要安装jquery作为DEP，但会自动需要。

查看导出功能的签名，看起来可能需要一个jQuery元素和选项：https：//github.com/select2/select2/slect2/blob/master/master/dist/js/select2.js#l50522

导入后，它应该仅作为插件附加到jQuery，所以我认为$('.some-element').select2([options]);也可以工作。

那么，您是否只是尝试require('select2')（如果没有尝试npm i jquery --save）？

Answer 2

如果现在有人在寻找此操作（'select'）不会将其附加起来，那么您必须 require('select2')();，您可以调用

$(document).ready(()=>{
  $('.select2').select2()
})

然后它将起作用。现在我已经用电子JS对此进行了测试。它正在工作！

在我的文档中，这是我首先导入所有内容然后选择2

  window.$ = window.jQuery = require("jquery");
  require('select2')();