laravel загружает компоненты vuejs только на страницу, где они мне нужны

Question

В данный момент мы загружаем все наши компоненты в app.js, используя

Vue.component('ID', path-to-component);

Это означает, что если у нас произошел сбой, то в одном из компонентов происходит сбой всех компонентов.

так есть ли способ загрузить компонент на нужную нам страницу?

Я пытался поместить его в стек в блейде, но он выдает ошибку

Uncaught ReferenceError: требование не определено vuejs

Мой код:

@push('scripts')
    <script>
        Vue.component('BookingPayments' ,  require('./components/bookings/bookings-payments'));
    </script>
@endpush

Answer 1

Просто используйте опцию импорта:

`Import otherComponent from './component/otherComponent.vue'`

Так что это не глобальный компонент, он доступен только на этой странице.

Answer 2

Я бы посоветовал вам использовать lucasmazza / page.js для загрузки кода JavaScript только по определенным URL-адресам.Вы можете указать свой код следующим образом:

page.at('payments', () => {
    Vue.component('BookingPayments', require('...'));
});

Библиотека использует атрибут data-page для тега body.

Вы можете использовать метод require только для файлов, являющихсяобработано Laravel Mix (webpack).