i use vue3 with Laravel and I want to make a layout for the admin panel and another one for the landing page, in the layout of the admin panel I use CSS and js files for metronic8 in welcome.blade.php file, but I want to load a different styles and scripts for the landing page. this part from welcome.blade.php:
<body id="kt_body" class="sidebar-enabled">
<div id="app"></div>
<script src="{{ asset('assets/assets/plugins/global/plugins.bundle.js') }}"></script>
<script src="{{ asset('assets/assets/js/scripts.bundle.js') }}"></script>
<script src="{{ asset('assets/assets/plugins/custom/fullcalendar/fullcalendar.bundle.js') }}"></script>
<script src="{{ asset('assets/assets/plugins/custom/datatables/datatables.bundle.js') }}"></script>
<script src="{{ asset('assets/assets/js/widgets.bundle.js') }}"></script>
<script src="{{ asset('assets/assets/js/custom/widgets.js') }}"></script>
<script src="{{ asset('assets/assets/js/custom/apps/chat/chat.js') }}"></script>
<script src="{{ asset('assets/assets/js/custom/utilities/modals/users-search.js') }}"></script> </body>
but on the landing page, I want to use different scripts and styles,
I tried to import the styles inside the AdminLayout.vue but it's not working:
<script lang="ts" setup>
import '../../../../public/assets/assets/js/scripts.bundle'
import '../../../../public/assets/assets/js/widgets.bundle'
import '../../../../public/assets/assets/js/custom/widgets'
import '../../../../public/assets/assets/js/custom/apps/chat/chat'
import '../../../../public/assets/assets/js/custom/utilities/modals/users-search'
import '../../../../public/assets/assets/plugins/global/plugins.bundle'
import '../../../../public/assets/assets/plugins/custom/fullcalendar/fullcalendar.bundle'
import '../../../../public/assets/assets/plugins/custom/datatables/datatables.bundle'
import AsideAdminLayout from './partials/AsideAdminLayout.vue';
import HeaderAdminLayout from './partials/HeaderAdminLayout.vue'; </script>
so, what is the best practice for doing this?