Estoy tratando de usar el selector de fechas lightpick en mi aplicación. Desafortunadamente, esto funciona cuando no sigo los estándares y no funciona cuando lo hago.
Espada :
@section('page_script') <script src="{{ url('js/themeFiles/moment/moment.min.js') }}"></script> <script src="{{ url('js/themeFiles/lightpick/lightpick.js') }}"></script> <script src="{{ url('js/custom/datePicker.js') }}"></script> <script src="{{ url('js/custom/planningStats.js') }}"></script> @endsection @section('content') @include('planning.partials.planningStatsForm') @endsectionselector de fecha.js:
var picker = new Lightpick({ field: document.getElementById('ddebut_picker'), secondField: document.getElementById('dfin_picker'), repick: true, lang: 'fr', singleDate: false, selectForward: true }); Error (si uso el código anterior): 
Si utilizo las etiquetas de script dentro @section('content') y no utilizo @section('page_script') , entonces todo funciona perfectamente. Pero para el código actual, no funciona. No he cambiado nada en js, controller, blade o model.
Mi JS no pudo encontrar los elementos, ya que mi pedido era incorrecto (incluso cuando era correcto cuando revisé la fuente de la página. Aunque confuso). defer el atributo diferido para resolver mi problema.
[defer, un atributo booleano] está configurado para indicar a un navegador que el script debe ejecutarse después de que se haya analizado el documento, pero antes de activar DOMContentLoaded.
Según esta respuesta , el orden importa . Hay otras formas de resolver el problema, pero descubrí que defer es más útil para scripts externos.
@section('page_script') <script src="{{ url('js/themeFiles/moment/moment.js') }}" defer></script> <script src="{{ url('js/themeFiles/moment/moment.min.js') }}" defer></script> <script src="{{ url('js/themeFiles/lightpick/lightpick.js') }}" defer></script> <script src="{{ url('js/custom/datePicker.js') }}" defer></script> <script src="{{ url('js/custom/planningStats.js') }}" defer></script> @endsectionProfundiza dónde se incluyeron los scripts de página en su diseño. Pienso en la cabeza. Busque en su código @stack('page_script').
Puede agregar en su diseño una sección sobre el cuerpo de cierre. @stack('custom_scripts') . Entonces sería un trabajo si "sigues el estándar". Cambie solo el nombre de page_script a @section('custom_script') .