Laravel 5 Laravel Example.vue未更新

我正在尝试找出如何在Laravel 5项目中使用Vue。基本Laravel安装附带app.js和Example.vue。我能够拥有 “我是一个示例组件！”通过添加到home.blade.php显示在我的视图中。让我迷惑的是，除了其他问题外，我根本无法更改此组件

如果我更改Example.vue中的文本（只是在模板部分，而不是逻辑中），它根本不会更新。（我试过按照Laravel文档等运行npm run dev，它似乎编译时没有错误，/public/js/app.js当时被修改，但浏览器中的视图没有改变。）

当我修改app.blade.php时，这些更改会显示出来，home.blade.php中的更改也会显示出来。但是，我找不到证据表明更改/resources/assets/js/app.js或Example.vue的内容有任何效果。更令人困惑的是，如果我从app.blade.php div元素中删除id=“app”，这不会导致示例组件消失。基于对vue JSFIDLE的使用，这似乎应该会破坏组件

我不确定这是某种缓存问题，还是编译问题，或者我不了解vue的工作方式，或者是什么，但我不知道出了什么问题。我直接使用laravel安装中的webpack.mix.js文件，并尝试停止和重新启动vagrant，重新加载浏览器和php artisan缓存：clear。（早些时候，我试着用长生不老药代替混合药，vueify和gulp也是一样的问题。）

---

任何建议都将不胜感激

您是否尝试从浏览器（F12）打开您的控制台，然后转到网络，选中并取消选中禁用缓存，然后重新加载页面。您的浏览器使用旧存储文件时出现了一些问题。

我也有同样的问题。禁用缓存、删除缓存和视图没有帮助。我正在使用Laravel5.4开发一个共享托管站点

本视频的评论建议 npm安装和npm运行监视。按照本页上的说明，我能够让npm安装正常工作，但npm run watch给了我错误

---

看起来Vue组件将是我想要做的事情的最佳解决方案，但是如果我不能让它们为我工作，我就只能使用AJAX了。

我也遇到了同样的问题。我使用的是本地开发环境（带有php7和mysql的macosxserra）。 我尝试了如上所述的缓存清理。停止并重新启动php服务器（以防万一……）：运气不好。然后是“编写器转储自动加载”：问题仍然存在。然后是“npm run watch”，它给出了以下消息：

> @ watch /Users/ulam/code/myproj
> cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

 10% building modules 1/1 modules 0 active Webpack is watching the files…

 95% emitting

 DONE  Compiled successfully in 4171ms

然后：

nks                    Chunk Names
  fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.eot?f4769f9bdb7466be65088239c12046d1  20.1 kB          [emitted]
fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.woff2?448c34a56d699c29117adc64c43affeb    18 kB          [emitted]
 fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.woff?fa2772327f55d8198301fdb8bcfc8158  23.4 kB          [emitted]
  fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.ttf?e18bbf611f2a2e43afc071aa2f4e1512  45.4 kB          [emitted]
  fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.svg?89889688147bd7575d6327160d64e760   109 kB          [emitted]
                                                                                               /js/app.js   1.2 MB       0  [emitted]  [big]  /js/app
                                                                                             /css/app.css   147 kB       0  [emitted]         /js/app


 WAIT  Compiling...                                                                                            19:48:26

 95% emitting

 DONE  Compiled successfully in 86ms                                                                           19:48:26

       Asset    Size  Chunks                    Chunk Names
  /js/app.js  1.2 MB       0  [emitted]  [big]  /js/app
/css/app.css  147 kB       0  [emitted]         /js/app


 WAIT  Compiling...                                                                                            19:49:37

 95% emitting

 DONE  Compiled successfully in 121ms                                                                          19:49:38

       Asset    Size  Chunks                    Chunk Names
  /js/app.js  1.2 MB       0  [emitted]  [big]  /js/app
/css/app.css  147 kB       0  [emitted]         /js/app

---

然后一切都起了作用。（Laravel 5.5.3）

我也遇到了同样的问题，我使用了XAMMP并尝试了“php artisan serve”，这对我来说很有效。

对于一个简单的Vue.js项目，我们通过

npm run serve

为该项目提供服务，它同时运行npm watcher。观察者监视Vue.js项目中的更改。由于我们通过

php artisian serve

提供服务，因此我们还需要运行

npm run watch

，因为

php artisan serve

只监视Laravel的更改

当您更改开发项目时，解决方案将同时运行

php artisan serve

和

npm run watch

安装：

npm安装npm手表

这对我来说很有用：

您可能会发现，在某些环境中，当文件发生更改时，Webpack不会更新。如果系统中出现这种情况，请考虑使用表轮询命令：

npm run watch-poll

---

此页面（）显示package.json文件中的cross-env路径缺少dist，因此对于我的package.json文件中的所有cross-env实例，我将cross-env/dist/I.e.“dev”：“node node_modules/cross env/dist/bin/cross-env.js node_env=development node_modules/webpack/bin/webpack.js--progress--hide modules--config=node_modules/laravel mix/setup/webpack.config.js“，完成后，npm run watch为我工作。也为我工作。但这只是我解决的问题吗？我是说。。如果其他人没有禁用缓存，他们仍然能够正确查看页面吗？