How to properly use a function declared outside Vue.js

Hello,

I’m developing a Vue module (using VueCLI) for an existing project.

I build my project and then I nest it inside an existing page in the platform.

Now I need to call some functions declared outside my project and loaded by the platform.

So I’m asking if there is a proper way to use it (for examples wrapping it in some part of my code) or it’s right to call them directly (eg inside methods of my component)

<input @click="callExtenalFunction">

methods: {
    callExternalFunction() {
        externalFunction()
    }
}

Thank you for your comments :slight_smile:

That depends how this done exactly:

How are those functions declared outside the project? as simple global functions in a <script> tag?

Yes.

They are declared in a .js file imported inside html page through <script> tag.

Then you should be able to access them simply by calliing window.nameOfTheFunction()

1 Like

Its working

  var gallery = new  PhotoSwipe( pswpElement, false, items, options);

Uncaught TypeError: WEBPACK_IMPORTED_MODULE_9__components_PhotoSwipe.a is not a constructor

change to:

  var gallery = new  window.PhotoSwipe( pswpElement, false, items, options);

Thx