Vue Компонент в большом Laravel проекте не отображается - без ошибок - PullRequest
Новая
       97

Vue Компонент в большом Laravel проекте не отображается - без ошибок

0 голосов
/ 04 мая 2020

У меня здесь очень странное происшествие, которое сводит меня с ума и не дает спать по ночам, и я не могу понять, почему это происходит. В основном у меня есть работающий проект laravel, довольно большой. Я установил vue, и после некоторой борьбы все, кажется, прошло хорошо, никаких ошибок в npm run dev или npm run production. Когда я проверяю свой блэйд-вид в браузере, я вижу там пример компонента, но он просто пуст. На этом изображении скриншот проверки.

app. js: 

require('./bootstrap');
window.Vue = require('vue');
Vue.component(
    'example',
    require('./components/Example.vue').default
    );
const app = new Vue({
    el: '#app'    
});

Пример. vue : 

<template>
    <div class="container">
        <div class="row">
            <div class="col-md-8 col-md-offset-2">
                <div class="panel panel-default">
                    <div class="panel-heading">Example Component</div>
                    <div class="panel-body">
                        I'm an example component!
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    export default {
        mounted() {
            console.log('Component mounted.')
        }
    }
</script>

Как вы можете видеть здесь выше, я использую компоновки компонентов по умолчанию, которые поставляются из коробки с vue / laravel, ничего эзотерического c. Как ни странно, на консоли я не получаю никаких ошибок, но я также не получаю никаких сообщений, и я также не могу получить вывод «Компонент установлен» на консоль. Я использую компонент в laravel блейд-файле следующим образом. 

<div id="app">
    <example></example>
</div>
<script src="{{ asset('js/app.js') }}"></script>

Кажется, что все настроено правильно, но остается пустым. Любые идеи, как я могу дальше отлаживать / исследовать эту проблему? Может ли быть что-то в laravel, что останавливает рендеринг или что-то еще? Есть довольно много скриптов и css загрузка, но даже когда я их удаляю, кажется, ничего не меняется. В настоящее время я работаю над бродячей коробкой для местной усадьбы с PHP 7.4.5 (cli), Composer 1.10.5, узлом v12.16.2, laravel / framework ^ 6.0, laravel / ui ^ 1.2, laravel-mix@1.7.2. Проект использует laravel6, таким образом, другие версии соответственно. Большое спасибо.

...