YayraBox Datatables JavaScript CDN конфликтует с Laravel

Я новичок в изучении Laravel.

Я включил бутстрап и общие css и js в свои шаблоны:

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

Я добавил CDN для библиотеки jquery и jquery-datatables, но теперь получаю сообщение об ошибке.

Чтобы заставить его работать, я закомментировал <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 и как я могу это решить?

javascript jquery css laravel datatables

02.05.2019 10:52

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

500

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Laravel app.js уже содержит jquery.js, поэтому вам не нужно добавлять его снова, поэтому таблица Yjra 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 тоже, вам просто нужно добавить css чуть ниже app.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">

даже у меня есть один репозиторий, вы можете подписаться на здесь.

Спасибо. У меня он работает с CDN, как я могу заставить активы работать?

— 02.05.2019 11:34

@GlenUK Вы можете скачать скрипт и css и поместить их в папки public/js и public/css соответственно, а затем вы можете использовать приведенный выше код, чтобы заставить его работать.

— 02.05.2019 11:36

02.05.2019 11:22