In laravel 5.5/vue.js appication to use jquery-confirm library - laravel

Question

In laravel 5.5/vue.js appication I would like to use jquery-confirm library and for this
In my resources/views/layouts/app.blade.php I wrote:
...
#yield('content')
</div>
<!-- Scripts -->
<script src="{{ asset('js/jquery/jquery.min.js') }}"></script>
<script src="{{ asset('js/funcs.js') }}"></script>
<script src="{{ asset('js/my_app.js') }}"></script>
<script src="{{ asset('js/jquery/jquery-confirm.min.js') }}"></script>
<script src="{{ asset('js/app.js') }}"></script>
</body>
<footer>
</footer>
</html>
But in console I got the error :
Uncaught TypeError: $.confirm is not a function
Was it wrong way of attaching files to the app?
Which is the right way?
Thanks!

Answer 1

The way I recommend doing this is:
Install jquery-confirm via NPM, simplest thing to do is to add it in your package.json under dependencies, e.g.:
"dependencies": {
...
"jquery-confirm": "^3.3.2"
}
Then require it in your app.js after jquery
require('./bootstrap');
require('jquery-confirm');
The next time your compile the package it should be included in your app.js
If you insist on including it in your source then one of the following would work:
Make sure the file is in your /resources/assets/js folder. Then update your webpack.mix.js to the following:
mix.js('resources/assets/js/app.js', 'public/js')
.sass('resources/assets/sass/app.scss', 'public/css')
.copy('resources/assets/js/jquery-confirm.min.js', 'public/css/jquery-confirm.min.js');
OR
Make sure the file is in your /public/js folder
By doing either of those you also need to make sure the file is loaded after app.js :
<script src="{{ asset('js/app.js') }}"></script>
<script src="{{ asset('js/jquery/jquery-confirm.min.js') }}"></script>