Webpack Encore select2 不工作，没有函数导入错误

Question

使用Symfony 4和Webpack Encore ，我无法让Select2工作。

我正在使用select2@4.0.3并在app.js这种方式导入：

import $  from 'jquery';
import 'bootstrap';
import 'select2';

我也尝试使用

Encore.autoProvidejQuery()

在webpack.config.js ，然后注意注释

import $ from 'jquery';

app.js一行，以便 jquery 不会被导入两次。

我尝试了在其他答案中可以找到的所有内容，例如：

import select2 form 'select2';

$(() => {
  $('.select2-enable').select2();
});

或者

select2($);

我几乎所有的尝试都会导致相同的错误：

类型错误：$(...).select2 不是函数

编辑：

现在工作。 每次我对app.js进行更改（并重新构建）时，我都会使用 firefox devtool 控制台来检查它是否正常工作，但我总是得到

不是函数

即使问题已解决并且 select2 正在工作，也会出错。

这是因为我使用 Webpack 浏览器控制台不再识别select2()函数了吗？

Answer 1

首先使用yarn安装它：

yarn add select2

然后将它与require而不是import ：

require('select2')

在您的app.js文件中。

使用 require 或 import 的工作原理相同。

Babel 将导入和导出声明转换为 CommonJS（需要），让您可以动态加载模块。

因此，尽管它们看起来相同，但请尝试始终使用 require。