2

Al llamar a una funcion en un script de javascript en tipo modulo, no me funciona, dice que no esta definido, pero en uno normal si me funciona.

Aqui si funciona.

const prueba = id => console.log(id)
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button onclick="prueba(15)">Prueba</button>
    <script src="./prueba.js"></script>
</body>
</html>

Aqui no funciona. Necesito que me funcione este.

const prueba = id => console.log(id)
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button onclick="prueba(15)">Prueba</button>
    <script type="module" src="./prueba.js"></script>
</body>
</html>

Gracias de antemano

1 respuesta 1

1

Es por un asunto de ámbito (scope), los modulos son accesible dentro de su propio ámbito no de forma global. Es decir solo puedes usar los elementos exportados dentro de la etiqueta script type="module". La solución es asignar el evento de esa etiqueta en lugar de asignalo en el HTML

<button id="pruebabtn">Prueba</button>
<script type="module">
    import { prueba } from './prueba.js';
    pruebabtn.addEventListener("click",e=>prueba(15))
</script>

Además te falta agregar la palabra clave export en tu archivo './prueba.js'

export const prueba = id => console.log(id);
1
  • Muchas gracias, lo del export se me paso Commented el 9 nov. 2023 a las 5:04

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.