JS file works good when reload page of home component but not works fine when click on link on home component Laravel VUE 3

I have facing an problem when i load home page which is home component then js works fine but when i go to another component then click on home component then js not works fine here it is my code this is welcome.blade.php

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>Kabira</title>
  <meta name="description" content="Morden Bootstrap HTML5 Template">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="shortcut icon" type="{{asset('newtheme/image/x-icon')}}" href="{{asset('newtheme/assets/img/favicon.ico')}}">
    
   <!-- ======= All CSS Plugins here ======== -->
  <link rel="stylesheet" href="{{asset('newtheme/assets/css/plugins/swiper-bundle.min.css')}}">
  <link rel="stylesheet" href="{{asset('newtheme/assets/css/plugins/glightbox.min.css')}}">
  

  <!-- Plugin css -->
  <!-- <link rel="stylesheet" href="assets/css/vendor/bootstrap.min.css"> -->
  
  <!-- Custom Style CSS -->
  <link rel="stylesheet" href="{{asset('newtheme/assets/css/style.css')}}">

  @vite('resources/css/app.css')
</head>
<body>
	<div id="app"></div>




	@vite('resources/js/app.js')

	<!-- All Script JS Plugins here  -->
  <!-- <script src="assets/js/vendor/popper.js" defer="defer"></script> -->
  <!-- <script src="assets/js/vendor/bootstrap.min.js" defer="defer"></script> -->

  <script src="{{asset('newtheme/assets/js/plugins/swiper-bundle.min.js')}}" defer="defer"></script>
  <script src="{{asset('newtheme/assets/js/plugins/glightbox.min.js')}}" defer="defer"></script>

  <!-- Customscript js -->
  <script src="{{asset('newtheme/assets/js/script.js')}}" defer="defer"></script>
  
</body>
</html>

i also load asset in app.js

import './bootstrap';


import {createApp} from 'vue'

import App from './App.vue';
import router from './routes.js';
import './assets/css/style.css';
import './assets/css/plugins/swiper-bundle.min.css';
import './assets/img/favicon.ico';
import './assets/css/plugins/glightbox.min.css';
import './assets/js/plugins/swiper-bundle.min.js';
import './assets/js/plugins/glightbox.min.js';
//import './assets/js/script.js';


createApp(App).use(router).mount("#app")

thanks for any help

shani786

2 years ago

Level 1

any help

Please or to participate in this conversation.