Including external script in vue.js template nuxt

Question

i try this solution to use external js but did't work

<template>
  <div>
    <script
      type="application/javascript"
      defer
      src="/assets/javascript/jquery.flexslider-min.js"
    ></script>
  </div>
</template>

the error shown

GET http://localhost:3000/assets/javascript/jquery.flexslider-min.js net::ERR_ABORTED 404 (Not Found)

Answer 1

If you're planning to use some NPM packages, the way to go is Nuxt plugins.
If you're more into loading 3rd party scripts, the approach explained here is the way to go: https://stackoverflow.com/a/67535277/8816585

By the look of your jQuery file, you will probably be interesting by this article: https://vueschool.io/articles/vuejs-tutorials/how-to-load-third-party-scripts-in-nuxt-js/

But if you can, try to either use NPM packages or look for packages in the Vue ecosystem rather than using jQuery.

Answer 2

When you use vue or nuxt, the proper way to use external packages is by installing them on your projects using npm or yarn or another package manager.