web-dev-qa-db-fra.com

Comment puis-je utiliser select2 avec webpack?

J'utilise webpack pour gérer tous mes actifs, lorsque j'utilise ce code pour demander à select2 ( https://github.com/select2/select2 ) J'ai l'erreur 

$ (...). select2 n'est pas fonctionnel.

require.ensure(['./vendors/select2'],function (require) {
    require('./site');
});

// site.js
(function ($) {
    $(document).ready(function () {
        $(".js-1example-basic-single").select2();
    });
})(jQuery);

Je pense qu'il y a quelque chose qui ne va pas avec l'exportation du module ... J'ai essayé plusieurs recherches, mais aucun espoir.

Quelqu'un veut-il me dire quoi faire? Cela m'a pris environ 10 heures.

Je vous remercie!

webpackjquery-select2select2
15
bnqtoan

Vous pouvez exécuter select2 de cette façon:

import $ from 'jquery';
import 'select2';                       // globally assign select2 fn to $ element
import 'select2/dist/css/select2.css';  // optional if you have css loader

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

Pour quiconque utilisant Parcel Bundler pour charger select2, son importation n'a pas fonctionné.

Je devais l'initialiser comme suit:

//Import
import $ from 'jquery';
import select2 from 'select2';

//Hook up select2 to jQuery
select2($);

//...later
$(`select`).select2();

Sans l'appel de raccordement et la transmission de jQuery à la fonction, la liaison serait impossible et une erreur $(...).select2 is not function. serait générée.

5
Adam Reis

Vous pouvez simplement faire comme ça: 

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


$('selector').select2(); //selector can be className, ID, tag name , attributeName , etc ...
0
MUSTAPHA GHLISSI