Not showing server changes, Vuejs Laravel?

Question

npm

The site is written in Laravel and Vuejs.
When changing vue files, I ran it in the console npm run watch, and all changes were immediately shown.
But when uploaded to the server, you need to clear the browser cache every time to see the result.
How can I do it programmatically? (I searched on Google but didn't find it)

Answer 1

There is (should be) a webpack.mix.js file in your project folder. Add .version() there. In the base case, it looks something like this:

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

This will add a new version to your js and css files after every change.
In order for the version to be displayed in the template, you need to include css and js using the mix helper, like this:

<link href="{{ mix('/css/app.css') }}" rel="stylesheet" media="all" />
<script src="{{ mix('/js/app.js') }}"></script>

Before uploading to the server, do npm run prod

Answer 2

Well, in general, laravel-mix should generate a hash for you. See how you connect files to blade. It is necessary through mix ()
And this way you can disable the cache in the browser

Answer 3

CTRL + F5 and SHIFT + F5 (linux) in the browser I have been using for a long time