Стек фронтэнда Symfony 3.3 с бисом - глобально плагины jquery

Я пытаюсь сделать приложение Symfony с материализовать CSS рамки. Согласно официальным документам 3.3, я использую бис для внешнего интерфейса.

У меня проблема с плагинами jquery во всем мире. Я пробовал это: Webpack Encore - jQuery плагины вне поля зрения, и это все еще не работает...

Итак... Мой конфиг веб-пакета:

var Encore = require("@symfony/webpack-encore");
var webpack = require('webpack');

Encore
    .setOutputPath('web/build/')
    .setPublicPath('/build')
    .cleanupOutputBeforeBuild()
    .autoProvidejQuery()
    .createSharedEntry('vendor', [
        'materialize-css',
        './assets/js/global.js',
    ])

    .addStyleEntry('global', './assets/scss/global.scss')
    .addEntry("createProfileModule", "./assets/js/modules/createProfile.js")

    .enableSassLoader()
    .enableSourceMaps(!Encore.isProduction())
    .enableVueLoader()
    .addPlugin(new webpack.ProvidePlugin({
        $: 'jquery',
        jQuery: 'jquery',
        'window.jQuery': 'jquery',
        Popper: ['popper.js', 'default'],
        // In case you imported plugins individually, you must also require them here:
        Util: "exports-loader?Util!bootstrap/js/dist/util",
        Dropdown: "exports-loader?Dropdown!bootstrap/js/dist/dropdown",
    }))
    .enableVersioning()
;

module.exports = Encore.getWebpackConfig();

В vendor.js я включаю global.js с:

$(document).ready(() => {
    $('.modal').modal();
    $(".modal .close-btn").on("click", () => {
        $('.modal').modal('close');
    });

    $(".button-collapse").sideNav();

    $("#registerModal form").submit((e) => {
        e.preventDefault();

        $(".modal .progress").fadeIn().promise().done(() => {
            setTimeout(() => {
                window.location = "/stworz-profil";
            }, 2500)
        })
    });
});

в этом файле все плагины jquery работают нормально. В createProfile.js:

$('input.autocomplete').autocomplete({
    data: {
        "Gdańsk": null,
        "Gdynia": null,
        "Sopot": null,
        "Warszawa": null,
    },
    limit: 20,
    onAutocomplete: function(val) {

    },
    minLength: 1,
});

и когда я загружаю страницу в консоли, я вижу:

Uncaught TypeError: $(...).autocomplete is not a function
    at Object../assets/js/modules/createProfile.js (createProfileModule.61543364cceab7b76d2b.js:13)
    at __webpack_require__ (manifest.d41d8cd98f00b204e980.js:55)
    at webpackJsonpCallback (manifest.d41d8cd98f00b204e980.js:26)
    at createProfileModule.61543364cceab7b76d2b.js:1

Как обеспечить JQuery с плагинами во всем мире?

1 ответ

Решение

Хорошо, после нескольких попыток я понял.

Решением является добавление $(document). Уже до автозаполнения

Другие вопросы по тегам