Our website is made possible by displaying online advertisements to our visitors. Please consider supporting us by whitelisting our website.

How to add JS library or plugin in Vuejs component from CDN

It is advisable and good to directly include a js file like this. But there are some things we need to work out of the box. I have been working on an existing project with Laravel and Vuejs, and I need to add a library quickly to work with existing code, so I figured out the below option.

We can add a JavaScript library or plugin to a Vuejs component in mounted.

    mounted () {
        document.body.classList.add(‘main-body’, ‘leftmenu’,’ltr’, ‘light-theme’, ‘dark-menu’);
        // load/include a CDN to Vuejs cli without npm
        if (document.getElementById(‘my-sweetalert2’)) {
            return; // was already loaded
        } else {
            var scriptTag = document.createElement(“script”);
            scriptTag.src = “//cdn.jsdelivr.net/npm/sweetalert2@11”;
            scriptTag.id = “my-sweetalert2”;
            document.getElementsByTagName(‘head’)[0].appendChild(scriptTag);
        }
    },

 

 

 

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Wordpress Social Share Plugin powered by Ultimatelysocial