load vue component in modal bootstrap

Hello I have a component in vue I am using rails 5, turbolink 5 and webpack.

If the component is placed directly on the page where the renderer makes a path, for example new.html.erb, the component loads But if I want to show that component in a modal with bootstrap I no longer load it, apparently it's just loading the component in the initial render I leave my code

This is the code where I load the component from a script

import Vue from 'vue/dist/vue.esm'
import MyComponent from '../app.vue'
import MultiText from '../components/multi_text.vue'

import TurbolinksAdapter from 'vue-turbolinks';
Vue.use(TurbolinksAdapter)
document.addEventListener('turbolinks:load', () => {
  var element= document.getElementById("este");
  if (element!=null) {
    var vueapp = new Vue({
      el: element,
      components: { MultiText}
    });
  }
});

Obviously in my html I put the div

<div id="este">
      <multi-text 
        ruta-save-campos="<%= guardar_campos_proyectos_path(@proyecto) if @proyecto.id.present? %>"
        campos-proyecto= "<%= @proyecto.campos.to_json if @proyecto.campos.present? %>" > 
      <multi-text/> 
    </div>

But if I invoke it from a modal it does not work

--- Update ----- I made the import VUe and MultiText as a global scope with the following line

window.Vue = Vue;
window.MultiText = MultiText;

Finally my file stayed that way

import Vue from 'vue/dist/vue.esm'
import MyComponent from '../app.vue'
import MultiText from '../components/multi_text.vue'

window.Vue = Vue;
window.MultiText = MultiText;

import TurbolinksAdapter from 'vue-turbolinks';
Vue.use(TurbolinksAdapter)
document.addEventListener('turbolinks:load', () => {
  var element= document.getElementById("este");
  if (element!=null) {
    var vueapp = new Vue({
      el: element,
      components: { MultiText}
    });
  }
});

This way I can use both Vue and MultiText on any page of my Rails application.