Компонировать компоненты Laravel Vue в разные файлы js - PullRequest
0 голосов
/ 07 июня 2019

У меня есть большой проект в Laravel, который имеет несколько внешних интерфейсов, в зависимости от зарегистрированного пользователя.

У меня также есть каталог shared, в котором общие компоненты (например, таблица, модальные и т. Д.) Могут использоваться различными интерфейсами.

Я хочу скомпилировать каждый интерфейс в отдельный файл js, чтобы я мог включить только соответствующий файл для каждого пользователя.

Что у меня есть до сих пор:

webpack.mix.js:

mix.js('resources/js/app.js', 'public/js')
    .js('resources/js/frontendUser.js', 'public/js')
    .js('resources/js/frontendAdmin.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css');

Под resources/js У меня есть отдельный файл для каждого интерфейса, например frontendAdmin.js:

require('./bootstrap');

window.Vue = require('vue');

Vue.component(
    'frontend-admin-component',
    require('./components/FrontendAdminComponent.vue').default
);

const app = new Vue({
    el: '#app',
});

Когда я запускаю npm run dev поля компилируются правильно, и я могу включить их из файла блейда:

<script src="{{ asset('js/frontendAdmin.js') }}" defer></script>

Однако, я получаю в консоли эту ошибку:

[Vue warn]: Unknown custom element: <frontend-admin-component>
 - did you register the component correctly? For recursive components,
 make sure to provide the "name" option.

Похоже, компонент ведет себя хорошо, однако я предполагаю, что предупреждение существует по какой-то причине и хотел бы его исправить.

Имеет ли смысл то, что я пытаюсь сделать? Что не так?

...