javascript - YayraBox 数据表 JavaScript CDN 与 Laravel 冲突

Question

我是 Laravel 的初学者。

我一直在我的模板中包含 bootstrap 和通用 css 和 js:

<!-- Styles -->
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
<!-- Scripts -->
<script src="{{ asset('js/app.js') }}" defer></script>

我已经为 jquery 和 jquery-datatables 库添加了 CDN，但现在出现错误。

为了让它工作，我注释掉了<script src="{{ asset('js/app.js') }}" defer></script>它由 Laravel 应用程序编译，这意味着我丢失了我拥有的所有自定义 JavaScript。

    <!-- Scripts -->
    <script
              src="https://code.jquery.com/jquery-3.4.0.min.js"
              integrity="sha256-BJeo0qm959uMBGb65z40ejJYGSgR7REI4+CW1fNKwOg="
              crossorigin="anonymous">
    </script>
    <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
    <!-- <script src="{{ asset('js/app.js') }}" defer></script> -->

    <!-- Styles -->
    <link href="{{ asset('css/app.css') }}" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">

为什么这些库与 Laravel 应用程序冲突，我该如何解决？

Answer 1

Laravel app.js 已经包含了 jquery.js，所以你不需要再添加它，所以 Yjra table js，应该添加到 app.js 的正下方

 <script src="{{ asset('js/app.js') }}"></script>
 <script src="{{ asset('js/jquery.dataTables.min.js') }}"></script> 

或

<script src="{{ asset('js/app.js') }}"></script>
 <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>

尝试将所有 JS 保留在页 footer 分，现在对于 css 也一样，您只需要在 app.css 下方添加 css

<link href="{{ asset('css/app.css') }}" rel="stylesheet">
   <link href="{{ asset('css/jquery.dataTables.min.css') }}" rel="stylesheet">

或

<link href="{{ asset('css/app.css') }}" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">

即使我有一个仓库，你也可以关注here .