Estoy tratando de tener diferentes archivos JS para cada Blade View en Laravel para ayudar a mantener limpia la estructura del proyecto.
Mi problema es que cuando intento acceder a una función desde ese archivo JS en una vista Blade, la consola devuelve un error de:
Error de referencia no capturado: myFunc no está definido en HTMLButtonElement.onclick
Pero el archivo está ahí y registra el mensaje de la consola desde ese archivo js.
Aquí están mis archivos y estructura:
recursos/js/index.js
console.log("Hello from index js"); function myFunc() { console.log("Hello"); }recursos/vistas/diseño/master.blade.php
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Laravel</title> </head> <body> @yield('content') {{-- @yield('js') --}} @stack('js') </body> </html>recursos/vistas/index.blade.php
@extends('layout.master') @section('content') <h1>Works</h1> <button onclick="myFunc()">Click</button> @endsection @push('js') <script src="{{ asset('js/index.js')}}"></script> @endpushwebpackmix.mix.js
const mix = require("laravel-mix"); mix.js("resources/js/app.js", "public/js").postCss( "resources/css/app.css", "public/css", [ // ] ); mix.js("resources/js/index.js", "public/js");Su función definida en el script que se cargó después del contenido del cuerpo principal, pero intenta acceder a esta función en el contenido del cuerpo principal.