2

I am a beginner of vue js. I am currently facing an issue with the external javascipt stopping when changing routes.

For example, when I start from / (root page), then click /shop, then click back / (root page), the external javascript stop working (Eg. slideshow stop).

I tried to use a plugin called vue-plugin-load-script. In order to dynamically load external javascript in main.js but the result is still the same, external javascript stops working when changing routes.

The external javascript is place in index.html

index.html


<html>

<body>

...

</body>

<script src="<%= BASE_URL %>js/plugins.js"></script>

</html>

route.js


{

path: '/',

name: 'home',

component: Home

},

{

path: '/shop',

name: 'shop',

component: Shop

},

App.vue


<template>

<div id="app">

<router-view />

</div>

</template>

External javascript is provided globally, so each page can be used. Can I run the same external javascript with different paths?

LI HO TAN
  • 113
  • 3
  • 11
  • I had the same problem with a social sharing script added in index.html just as yours in an Angular project. I have to reinsert and remove the script in the page whenever route changed. This worked but I am sure that was not a proper solution and was a hack. – Muhammad Ahsan Jun 27 '19 at 16:07
  • @Ahsan Yes, sir, I know the way, but this seems to be repetitive, because every page needs to insert and delete scripts, it's very cumbersome, waiting for the experts to come up with a trick to do this. – LI HO TAN Jun 27 '19 at 16:19
  • I want to know about the correct method too. I haven't found any good solution for it. – Muhammad Ahsan Jun 27 '19 at 16:35

1 Answers1

0

try changing the route for a realative <%= BASE_URL %>/js/plugins.js instead <%= BASE_URL %>js/plugins.js

men32z
  • 186
  • 4
  • 10
  • I believe you were wrong sir, https://imgur.com/a/kuXwnIR, it should be <%...%>js/plugins.js instead of <%...%>/js/plugins.js – LI HO TAN Jun 27 '19 at 16:25
  • so, the file was loaded the way you had it? – men32z Jun 27 '19 at 16:47
  • Yes, i show had show in a screenshot at the link i commended just now. I want to tell you that the external javascript is loaded properly, but changing the route, the original components are removed and placed by new components, but the JavaScript didnt work for the next new components. – LI HO TAN Jun 27 '19 at 16:57
  • yeah man, I'm sorry, I didn't read well, so I think you should try [this](https://stackoverflow.com/questions/45047126/how-to-add-external-js-scripts-to-vuejs-components) this way you load the scrip in every place on your spa – men32z Jun 27 '19 at 20:15