У меня есть большой проект в 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.
Похоже, компонент ведет себя хорошо, однако я предполагаю, что предупреждение существует по какой-то причине и хотел бы его исправить.
Имеет ли смысл то, что я пытаюсь сделать? Что не так?