【发布时间】：2017-06-13 07:37:14
【问题描述】：
我在我的 Laravel 5.3 应用程序中设置了一个自定义 Vue 组件。它工作正常，但我必须在我的浏览器中进行缓存刷新，以便在我运行 gulp 后对我的组件进行任何更改。这在我开发时很烦人，并且不能用于部署。我的 gulpfile 或其他地方是否需要某种指令来使缓存清除自动发生？我错过了什么？
【问题讨论】：
标签： laravel gulp browser-cache vue-component
【发布时间】：2017-06-13 07:37:14
【问题描述】：
可能看起来像一个愚蠢的问题，或者我完全错过了这个问题，但你在使用 elixir 吗？
gulpfile.js
.scripts('my-file.vue.js', 'public/js/my-file.vue.js', 'resources/assets/js')
稍后在您的文件中...
.version(['js/my-file.vue.js', (...)]);
在你的刀片中：
<script src="{{ elixir('js/my-file.vue.js') }}"></script>
注意：请阅读此答案下方的 cmets 以查看解决方案的路径，因为它可能比直接阅读更清晰。
【讨论】：
-
是的，我正在使用elixir，我正在使用webpack来编译我的vue组件。我有一个 .webpack('app.js')，但没有 .version('app.js')。我是否需要像您在此处的帖子所建议的那样独立对每个 vue 文件进行版本控制，或者我可以将 app.js 作为一个整体进行版本控制吗？我是在 .webpack 调用之前还是之后这样做？
-
需要对文件进行版本控制，因为每次修改文件时都会创建一个新的哈希值，因此您将“强制”缓存，因为旧文件将不存在。由于我对 webpack 缺乏了解，我现在无法为您提供 webpack 帮助。不过，它在我接下来几天的清单中。检查您的公共文件并查看您的 javascript 的名称。如果它们不是 my-file.iasjdsadas7dasd.js 之类的东西，那么您就没有进行版本控制:)。您可以简单地通过 .version() 进行版本控制。
-
我想补充一点：Webpack 可能有办法不需要通过“npm run dev”左右对文件进行版本控制。我不太愿意给出这个答案，但我对这个主题做了一个非常简单的搜索。
-
好的，我将 gulpfile 更改为在 .version 调用之前调用 .webpack，并将 'public/js/app.js'（webpack 调用的最终输出）添加到我的 .version 调用中的脚本和样式。这似乎解决了这个问题！ （我提到移动 .webpack 调用，因为我第一次尝试在 .webpack 调用之后添加第二个 .version 调用，结果把东西放在奇怪的地方，破坏了事情。只做一个 .version 调用并包括 .webpack 输出不过，在列表中做到了。）
-
我将此标记为答案，但可能值得对其进行编辑以做笔记，以指导未来的读者也阅读 cmets。