Невозможно прочитать свойство 'fn' из неопределенного / Uncaught TypeError: $ (...). Daterangepicker не является функцией

Question

Я пытался отобразить jquery datepicker на своей веб-странице, но он выдал 2 ошибки:

1. Uncaught TypeError: Cannot read property 'fn' of undefined
2. Uncaught TypeError: $(...).daterangepicker is not a function

выглядит такЯ что-то пропустил

Я использую jquery 3.3.1.min.js и datepicker.js

вот код в html и заголовок

<link rel="stylesheet" type="text/css" href="{{ url('') }}/assets/header_css/bootstrap.css" />
<script type="text/javascript" src="{{ url('') }}/assets/header_js/daterangepicker.js"></script>

вот коддля типа ввода

<input type="text" value ="YYYY/MM/DD" class="form-control datepicker" v-model="tanggalpickup"  name="tanggalpickup" id="tanggalpickup"/>

вот код для javascript

$(document).ready(function() {
    $("input.datepicker").singleDatePicker();
  });

  $.fn.singleDatePicker = function() {
    $(this).on("apply.daterangepicker", function(e, picker) {
      picker.element.val(picker.startDate.format(picker.locale.format));
    });
    return $(this).daterangepicker({
      locale: {
        format: 'YYYY-MM-DD' // Change to local formats YYYY-MM-DD - MM-DD-YYYY
      },
      singleDatePicker: true,
      autoUpdateInput: false
    });
  };

все ваши ответы будут высоко оценены

Answer 1

Причина в том, что библиотека datepicker неправильно инициализирована.Когда вы добавляете библиотеки, которые используют jQuery, вам нужно добавить их после jQuery.

Код должен выглядеть так:

<script src='yourpath/jquery.min.js'></script>
<script src='yourpath/daterangepicker.js'></script>