ExampleComponent.vue 不工作 Laravel 7答案

【问题标题】：ExampleComponent.vue is not working Laravel 7ExampleComponent.vue 不工作 Laravel 7
【发布时间】：2020-10-04 09:53:48
【问题描述】：

我尝试了很多方法从 stackoverflow、laracast、google 解决这个问题，但没有任何效果，

-> 我认为我的 vue.js 没有加载或工作（我使用 sublime 文本，所有文件都显示 除了 ExampleCmponent.vue 文件之外的突出显示或彩色文本）， npm run watch 成功，但 vue devtools 也没有检测到任何 vue。

-> 我也试过了：

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

我正在与您分享屏幕截图，如果可能，请帮助我： ExampleComponent.vue

home.blade：我也试过不带#id标签->

chrome：vue 开发工具：

这里是 app.js：

我试过了：

Laravel 5 VueJS not working

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

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

【问题讨论】：

标签： laravel vue.js laravel-7

【解决方案1】：

你在这里所做的被称为Fronend-Scaffolding。你仍然需要Compile Assets。

打开您的 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>

【讨论】：