【Laravel5.8】jQuery UIのDatepickerを導入したい

jQuery UIのDatepicker導入には色々と方法がありますが、

jQuery “ $(”#datepicker“).datepicker is not a function”
jQuery “ $ is not defined”

などのエラーに悩まされることが多かった。

以下のコードで起動確認しました。

<!DOCTYPE html>
<html lang="ja" dir="ltr">
	<head>
		<meta charset="utf-8">
		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/themes/base/jquery-ui.min.css">
		<title>@yield('title')</title>
	</head>
	<body>
		<div class="shake">
			<form>
				<input type="text" id="datepicker">
			</form>
		</div>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" type="text/javascript"></script>
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="Stylesheet" type="text/css" />
<script>
	$('#datepicker').datepicker();
</script>
	</body>
</html>

ポイントは、jQueryCDNなどを使用せずに

  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" type="text/javascript"></script>
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="Stylesheet" type="text/css" />

を使用するということですね。