Как использовать функции js из файла laravel -mix (webpack) в других js файлах, включенных позже через файл представления? - PullRequest
Новая
       7

Как использовать функции js из файла laravel -mix (webpack) в других js файлах, включенных позже через файл представления?

1 голос
/ 19 февраля 2020

У меня есть проект, в котором я использую laravel mix для создания одного уменьшенного js файла, используемого на всей странице. 

const mix = require('laravel-mix');
mix.config.publicPath = 'public_html';
mix.js([
    'public_html/themes/sagafrontend/js/jquery-1.9.1.js',
    'public_html/themes/sagafrontend/js/jquery-ui.js',
    'public_html/themes/sagafrontend/js//main.js',
    'public_html/themes/sagafrontend/js/bootstrap.min.js',
    'public_html/themes/sagafrontend/js/custom.js',
    'public_html/themes/sagafrontend/js/custom2.js',
], 'public_html/themes/sagafrontend/js/app.js')
    .version();

Минимизированный файл содержит функцию lozad (из зависимости в пакете. json ), который использует обозреватель для отложенной загрузки изображений на всю страницу. 

var lozad = require('lozad');
var observer = lozad();
observer.observe();

На странице продукта я добавил новую функцию фильтрации, которая вызывает ajax для фильтрации продуктов на данной странице списка продуктов. В короткой версии это выглядит так: 

function filterProducts(filterVariables) {
        var path = '/productFilter';
        $.ajax({
            type: 'post',
            url: path,
            dataType: 'json',
            data: {
                filterVariables: filterVariables
            },
            success: function (data) {
                $('.filter-container').empty().append(data.products);
            },
            error: function (xhr, status, thrown) {
            }
        });
}

И все отлично работает - товары добавляются на страницу через ajax. Функции фильтра находятся в отдельном файле , загруженном в laravel представление , потому что я использую фильтры только в один просмотр , поэтому нет нужно поместить весь код в глобальный файл min (этот сгенерирован с помощью laravel mix). 

@section('pageScripts')
<script src="{{ asset('themes/sagafrontend/js/filters.js') }}" defer></script>
@endsection

Проблема в том, что продукты, добавленные на страницу, не видны для наблюдателя, а пути к изображениям не обновляются. Поэтому после вызова фильтров img data-sr c не изменяется на img sr c. В результате изображения не загружаются.

Фильтры. js - это класс c js файл с функциями, поэтому я не могу использовать require ('lozad') для вызова наблюдателя для него. Он выдаст ошибку 'Uncaught ReferenceError: require is notfined' Есть ли довольно простой способ получить доступ к lozad и вызвать обозреватель, не помещая все в один js файл?

...