YayraBox 数据表 JavaScript CDN 与 Laravel 冲突

Question

我是学习 Laravel 的初学者。

我一直在我的模板中包含引导程序和通用 css 和 js：

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

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

为了让它工作，我注释掉了由 Laravel 应用程序编译的 <script src="{{ asset('js/app.js') }}" defer></script>，这意味着我丢失了我拥有的任何自定义 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 保留在页脚部分，现在对于 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。