ExampleComponent.vue не работает Laravel 7

Я пробовал много способов решить эту проблему из stackoverflow, laracast, google, но ничего не работает,

-> Я думаю, что мой vue.js не загружается и не работает (я использую возвышенный текст, все файлы показывают выделенный или цветной текст, кроме файла ExampleCmponent.vue), npm run watch успешно, но vue devtools также не обнаруживает никаких vue.

-> Я также пробовал:

<div id="app">
     <example-component></example-component>
 </div>

Я делюсь с вами снимками экрана, пожалуйста, помогите мне, если возможно: ExampleComponent.vue

ExampleComponent.vue

home.blade: я тоже пробовал без #id tag->

home.blade

хром: vue devtools:

введите описание изображения здесь

вот app.js:

app.js

Я пытался:

Laravel 5 VueJS не работает

https://laracasts.com/discuss/channels/vue/example-component-not-working

https://laravel.com/docs/7.x/frontend


person Daljit Singh    schedule 15.06.2020    source источник


Ответы (1)


То, что вы сделали здесь, называется Fronend-Scaffolding. Вам по-прежнему необходимо компилировать ресурсы.

Откройте свой webpack.mix.js и добавьте файлы .js и .scss. После этого убедитесь, что файлы находятся в папке public / js / css.

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css');

Затем добавьте на лезвие линии ниже.

// use mix() for cache bursting. Or simply stick with asset()
<link href="{{ mix('css/app.css') }}" rel="stylesheet">
<script src="{{ mix('js/app.js') }}"></script>
person Digvijay    schedule 15.06.2020