Load VUE app in WordPress Visual Composer editor

load-vue-app-in-wp-visual-composer-editor.js

/*

How to load a VUE app in Wordpress admin inside Visual Composer editor.
For example if the VUE app is rendered using a shortcode.

Visual Composer editor is inside an iframe but calls trigger 'vc_build' on the parent. 
Hence the need to register an listener on the parent (main) document and from it call a script inside the iframe.

This script can be enqueued with the WP usual wp_enqueue_script() since it will be in both the parent and iframe document.

*/

jQuery(window).on('vc_build', function() {

    jQuery("#vc_inline-frame")[0].contentWindow.mountVueApp();
});

// This script is to run inside the iframe
window.mountVueApp = function(args) {

    app.mount('#my-vue-app');
}