load-vue-js-modal-jquery.js

(function($) {
  $.getStylesheet = function (href) {
    var $d = $.Deferred();
    var $link = $('<link/>', {
       rel: 'stylesheet',
       type: 'text/css',
       href: href
    }).appendTo('head');
    $d.resolve($link);
    return $d.promise();
  };
})(jQuery);

$.getStylesheet('https://cdn.jsdelivr.net/npm/[email protected]/dist/styles.css')
require([
  'https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.min.js', 
  "https://cdn.jsdelivr.net/npm/[email protected]/dist/index.js"
],function(imjoyLoader, Vue, vuejsmodal){
  Vue.use(vuejsmodal.default)
  var elem = document.createElement('div');
    elem.id = 'app';
    elem.innerHTML = `
    <button class="btn" @click="show()">Show</button>
    <modal name="hello-world">
    hello, world!
    </modal>
    `
    document.getElementById('maintoolbar').appendChild(elem);
    var app = new Vue({
      el: '#app',
      data: {
        message: 'Hello Vue!'
      },
      methods: {
        show () {
          this.$modal.show('hello-world');
        },
        hide () {
          this.$modal.hide('hello-world');
        }
      }
    })
})