# Laravel - Datatables not working with webpack

40
July 16, 2019, at 3:50 PM

I'm currently adding webpack to existing project, but I'm having a problem setting up Datatables with it. Currently using "yajra/laravel-datatables-oracle": "8.13.6"

When I run npm, my Datatables don't work, and I'm getting this error in console:

Webpack configuration:

mix.styles([
'public/css/style-general.css',
'public/dist/style.css'
], 'public/css/style.css');
mix.styles([
'node_modules/datatables.net/css/dataTables.bootstrap3.css'
mix.scripts([
'node_modules/datatables.net/js/jquery.dataTables.js',
'node_modules/datatables.net-dt/js/dataTabeles.dataTables.js',
'node_modules/datatables.net-bs/js/dataTables.bootstrap.js',
'node_modules/jquery-validation/dist/jquery.validate.js',
// app styles and scripts
mix.scripts([
mix.copyDirectory('node_modules/datatables.net-dt/images', 'public/images');
if (mix.inProduction()) {
mix.version();
}

The only guess of why is it not working is that my scripts aren't called in correct order. Currently they are called like this, in my app layout: Header:

<link href="/metronic/assets/global/css/components-md.min.css" rel="stylesheet" id="style_components" type="text/css" />
@if(isset($styles)) @foreach($styles as $key =>$value)
<link rel="stylesheet" href="{{$value}}"/> @endforeach @endif Footer: <script src="/metronic/assets/global/plugins/jquery.min.js" type="text/javascript"></script> <script src="/metronic/assets/global/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script> <script src="/metronic/assets/global/plugins/js.cookie.min.js" type="text/javascript"></script> <script src="/metronic/assets/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js" type="text/javascript"></script> <script src="/metronic/assets/global/plugins/jquery.blockui.min.js" type="text/javascript"></script> <script src="/metronic/assets/global/plugins/bootstrap-switch/js/bootstrap-switch.min.js" type="text/javascript"></script> <script src="/metronic/assets/global/plugins/bootstrap-toastr/toastr.min.js" type="text/javascript"></script> <script src="/metronic/assets/global/scripts/app.min.js" type="text/javascript"></script> <script src="/metronic/assets/pages/scripts/dashboard.min.js" type="text/javascript"></script> <script src="/metronic/assets/global/plugins/morris/morris.min.js" type="text/javascript"></script> <script src="/metronic/assets/global/plugins/morris/raphael-min.js" type="text/javascript"></script> <script src="/metronic/assets/layouts/layout5/scripts/layout.min.js" type="text/javascript"></script> <script src="/metronic/assets/layouts/global/scripts/quick-sidebar.min.js" type="text/javascript"></script> <script src="/metronic/assets/layouts/global/scripts/quick-nav.min.js" type="text/javascript"></script> <script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.15.0/jquery.validate.min.js"></script> <script src="/metronic/assets/global/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js"></script> <script src="/metronic/assets/global/plugins/moment.min.js"></script> @if(isset($scripts))@foreach($scripts as$key => $value) <script src="{{$value}}?v={{Config::get('app.assets_version')}}"></script>
@endforeach @endif
<script src="/js/main.js"></script>

I'm struggling with this for a while now. Any help is appreciated. If you need any else information or code samples, let me know.

POPULAR ONLINE

45

### In amcharts, is there any way to show tooltips text according to condition?

I want to show tooltips text in the chart according to my conditionIf my text value is 0 then I want to hide text otherwise show the text of the tooltip

17

### Are complex functions plots possible in jsx graph?

Suppose one attempts to plot the complex valued function $f:\mathhbb{C} \to \mathhbb{C}$ as $f(z) =z$ in jsx graphIt may not be complicated as it appears

25

### Document Management System/Libraries

I am looking for a document management library with basic functionalists like searching, entitlementsPreferably in java

41