In my vuejs inertia app, external javascript files stop working on any route action like so.
This is code in home.vue:
import Sidebar from "../components/sidebar";
import Topbar from "../components/topbar";
import { Head } from "@inertiajs/inertia-vue3";
import { loadScript } from "vue-plugin-load-script"
export default {
name: "home",
components: {Topbar, Sidebar,Head},
mounted() {
//init menu
loadScript("js/template/jquery/jquery.min.js");
loadScript("js/template/bootstrap/js/bootstrap.bundle.min.js");
loadScript("js/template/metismenu/metisMenu.min.js");
loadScript("'js/template/simplebar/simplebar.min.js");
loadScript("js/template/node-waves/waves.min.js");
loadScript("https://unicons.iconscout.com/release/v2.0.1/script/monochrome/bundle.js");
loadScript("js/template/air-datepicker/js/datepicker.min.js");
loadScript("js/template/air-datepicker/js/i18n/datepicker.en.js");
loadScript("js/template/apexcharts/apexcharts.min.js");
loadScript("js/template/jquery-knob/jquery.knob.min.js");
loadScript("js/template/jqvmap/jquery.vmap.min.js");
loadScript("js/template/jqvmap/maps/jquery.vmap.usa.js");
loadScript("js/template/app.js");
loadScript("js/template/dashboard.init.js");
}
}
The same code is on inventory.vue, but on any route change, even if revisiting home.vue by inertia router, all javascripts being loaded stop working until page refresh. How can i fix this?