Событие изменения jquery не запускается в экспортированном модуле

Question

Я сейчас обновляю проект для использования webpack.У меня есть два сценария, основной сценарий и дополнительный сценарий, обрабатывающий все функции магазина.Сценарий shop состоит из объекта с рядом функций.Затем объект экспортируется с использованием module.exports.

. У меня проблема в том, что функция change productVariant.val(variant).change() в сценарии shop не запускается.

Событиеработал при загрузке обоих скриптов вместо использования пакета webpack.Я предполагаю, что есть простое решение для этого, но не могу решить его.

Так как у меня есть сценарий shop, требуемый в основном сценарии, я не включил его в app.js,не уверен, что это имеет значение.

App.js

// scripts
require('./main-js');

// css
require('../scss/style.scss');

Основной сценарий

var $ = require('jquery');

var shopjs = require('./shop');
var shop = shopjs.shopObj;

// ...

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

    $('.variant').click(function () {
        var variant = $(this).data('variant');
        var display = $(this).data('display');
        var type = $(this).data('type');

        shop.updateVariant(variant, display, type);
    });

    // ...
});

Shop Script

var $ = require('jquery');

var shop = {
    updateProductQty: function (qty) {
        var productQty = $('.cart .qty');
        productQty.val(qty);
    },
    updateVariant: function (variant, display, type) {
        var productVariant = $('.cart #' + type);
        productVariant.val(variant).change();

        // ...
    }

    // ...
}

module.exports.shopObj = shop;

Answer 1

Почему вы так экспортируете?

module.exports.shopObj = shop;

Вместо этого сделайте это:

module.exports = shop;

А внутри основной скрипт импортируйте его:

var shopjs = require('./shop');

shopjs.updateVariant(....

А затем используйте импорт ES6 с babel.И не забудьте НЕ использовать экспорт по умолчанию, чтобы вы знали, что экспортируется, а что нет.