Laravel DataTables不是一个函数

Question

我正在使用Laravel，并且希望在我的观点中使用DataTables。

这是我的头标签

    <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <!-- CSRF Token -->
        <meta name="csrf-token" content="{{ csrf_token() }}">

        <title>{{ config('app.name', 'Laravel') }}</title>

        <!--Font Awsome-->
        <link rel="stylesheet" href="{{asset('vendor/fontawesome-free/css/all.min.css')}}">

        <!-- Fonts -->
        <link rel="dns-prefetch" href="//fonts.gstatic.com">
        <link href="https://fonts.googleapis.com/css?family=Nunito" rel="stylesheet">
        <!-- Scripts -->
        <script src="{{ asset('js/app.js') }}" defer></script>
        <!-- Styles -->
        <link href="{{ asset('css/app.css') }}" rel="stylesheet">
        <link rel="stylesheet" href="{{asset('vendor/css/sb-admin-2.min.css')}}">
        <link href="{{asset('vendor/datatables/dataTables.bootstrap4.min.css')}}" rel="stylesheet">

这是我的剧本

    <script src="{{asset('vendor/bootstrap/js/bootstrap.bundle.min.js')}}"></script>
    <script src="{{asset('vendor/jquery/jquery.min.js')}}"></script>


    <!-- Core plugin JavaScript-->
    <!-- Custom scripts for all pages-->
    <script src="{{asset('vendor/js/sb-admin-2.min.js')}}"></script>
    <script src="{{asset('vendor/jquery-easing/jquery.easing.min.js')}}" defer></script>

    <!--Data Tables JavaScript-->
    <script src="{{asset('vendor/datatables/jquery.dataTables.min.js')}}"></script>
    <script src="{{asset('vendor/datatables/dataTables.bootstrap4.min.js')}}"></script>

    <script>
        $(document).ready( function () {
            $('#dataTable').DataTable();
        } );
    </script>

这是桌子

<table id="dataTable" class="table table-bordered" width="100%" cellspacing="0">
...
</table>

在这里我遇到了这个问题

Uncaught：$(.).DataTable不是HTMLDocument的函数。(议程:268号) (jquery.min.js:2) t (jquery.min.js:2)

我已经使用延迟，切换jquery位置，删除jquery-easing什么都不起作用。请帮帮忙。

Answer 1

使用数据表中的相同序列

https://code.jquery.com/jquery-3.3.1.js
https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js

使用CDN进行测试，如果一切正常，然后在本地导入

<!-- footer section ->
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js">
</script>

<script>
    $(document).ready( function () {
           $('#dataTable').DataTable();
    } );
</script>
 < /!-- footer section ->
 <-- header section ->

<link rel="stylesheet" type="text/css" href="http://laravel.test/laravel-paud-master/public/vendor/datatables/dataTables.bootstrap4.min.css">
 < /!-- header section ->