Menu icon Foundation
How to include jQuery plugin using webpack?

Hi! I'm trying to include a jQuery plugin via webpack and I get an error. Here's the app.js code, following Foundation app.js initial code

 

import $ from 'jquery';

require("imports-loader?jQuery=jquery!./jquery.rut.min.js");

window.$ = $;

$(document).foundation();

$(document).ready( function($) {

    $('input[type=text]').rut().on('rutValido', function(e, rut, dv) {

        alert("El rut " + rut + "-" + dv + " es correcto");

    }, { minimumLength: 7} );

});

jquery.rut.min.js is loaded but I get the following error

Uncaught TypeError: (0 , _jquery2.default)(...).foundation is not a function

    at Object.module.exports.module.deprecate (app.js:9922)

    at __webpack_require__ (app.js:20)

    at Object.<anonymous> (app.js:10037)

    at __webpack_require__ (app.js:20)

    at _typeof (app.js:66)

    at app.js:69

What's the correct way to use a jQuery plugin inside Zurb Foundation taking advantage of webpack integration?

javascriptwebpackjquery

Hi! I'm trying to include a jQuery plugin via webpack and I get an error. Here's the app.js code, following Foundation app.js initial code

 

import $ from 'jquery';

require("imports-loader?jQuery=jquery!./jquery.rut.min.js");

window.$ = $;

$(document).foundation();

$(document).ready( function($) {

    $('input[type=text]').rut().on('rutValido', function(e, rut, dv) {

        alert("El rut " + rut + "-" + dv + " es correcto");

    }, { minimumLength: 7} );

});

jquery.rut.min.js is loaded but I get the following error

Uncaught TypeError: (0 , _jquery2.default)(...).foundation is not a function

    at Object.module.exports.module.deprecate (app.js:9922)

    at __webpack_require__ (app.js:20)

    at Object.<anonymous> (app.js:10037)

    at __webpack_require__ (app.js:20)

    at _typeof (app.js:66)

    at app.js:69

What's the correct way to use a jQuery plugin inside Zurb Foundation taking advantage of webpack integration?