Как импортировать компонент vue в скрипт laravel blade

Question

Я хочу сделать ссылку на компонент vue, как эта ссылка: https://jsfiddle.net/xmqgnbu3/1/.

Но в этом коде компонент кода и код js находятся на одной странице. Я использую laravel с vue, а компоненты находятся в другой папке (ссылка: https://ibb.co/g3CvHz6)

Я пробовал все это, но у меня есть ошибка в "import" в "require":

@section('contenido')

<!-- CSRF Token --> 
<meta name="csrf-token" content="{{ csrf_token() }}">

<div id="app" class="container"> 
    <matricula ref="matri"></matricula> 
</div> 
<input type="hidden" id="csrf_token" value="{{ csrf_token() }}" />
<script src="{{ elixir('js/app.js') }}"></script>
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>

<script>

import MatriculaComponent from '../js/components/MatriculaComponent.vue';
let MatriculaComponent=require('../js/components/MatriculaComponent.vue');
var vm = new Vue({ el: '#app', components: { matricula } });

var vm=$("#app")
function createItem(){
    //this.$refs["matri"].Prueba();
    //vm.$refs.matri.Prueba();
    //vm['my-component'].Prueba();
    console.log("la referencia: "+this.$refs.matri.Prueba())
    //this.$refs.matricula.Prueba();
}
</script>

@endsection

Я ожидаю вашей помощи. спасибо

Answer 1

Главное - создать компонент vue и установить там шаблон и скрипт. затем, после компиляции, вы можете поместить имя компонента в блейд как хотите.

FMI, вы должны прочитать Как создать и справиться с компонентом vue в laravel