0

Mi problema es el siguiente, estoy implementando los import y exports a mi proyecto para hacerlo mas mantenible y limpio, pero al poner type= modal a mi link de js, me salta un error.. Haciendo pruebas descubrí que no me deja tener el onload y me rompe mi app, ya que el onload lo uso para cargar mi localStorage a unos arrays..

Errores: 1º-Si tengo el type modal puesto en la linea de script: No me salta errores pero tampoco me funciona nada de la app, he probado a hacer un simple console.log, incluso sin import ni export de nada y no me funciona.

2º- Si quito el type modal, me aparece: Uncaught SyntaxError: import declarations may only appear at top level of a module (Aunque esto es normal creo).

3º- El error me lo daba al tener un onload en el body pero al final resulto ser porque no funciona el modal directamente, por lo que me gustaria solucionar el primer error.

El caso es que me gustaría que funcionara correctamente los modal y mi app, ¿alguien sabe como puedo solucionarlo?

Mi código HTML:

    <body onload="allStorage()">
    <!--HEADER-->
    <header>
        <div>
            <h1 id="headerTitle">Your Promotor List</h1>
        </div>
    </header>

    <!--FORMULARIO DE LOGIN PARA LOS PROMOTORES O ADMINS-->
    <main id="container">
        <div class="form-container" id="singinContainer">
            <h2 class="form-title">Sing In Your Event!</h2>
            <form class="form" id="signinForm">
                <label for="eventName">Event Name</label>
                <input class="form__input" type="text" id="eventName" required>
                <label for="adminName">User</label>
                <input class="form__input" type="text" id="adminName" required>
                <label for="adminMail">Mail</label>
                <input class="form__input" type="email" id="adminMail" required>
                <label for="adminPassword">Password</label>
                <input class="form__input" type="password" id="adminPassword" required>
                <button class="btn btn-on" type="submit" id="signInAdminBtn">Sign In</button>
            </form>
            <span id="signInErrorOrSuccessMessage"></span>
            <a class="link btn btn-off" id="linkToLogin">You already have it? Click Here</a>
        </div>
        
        <div class="form-container none" id="loginContainer">
            <h2 class="form-title">LOGIN</h2>
            <form class="form" id="loginForm">
                <label for="userName">UserName</label>
                <input class="form__input" type="text" id="userName"required>
                <label for="password">Password</label>
                <input class="form__input" type="password" id="password" required>
                <button class="btn btn-on" type="submit" id="submitLoginBtn">Login</button>
            </form>
            <span id="loginErrorOrSuccessMessage"></span>
            <a class="link btn btn-off" id="linkToSingin">¿New User? Click Here</a>
        </div>
    </main>

      <!--Panel de ADMINISTRADOR una vez logeado-->
    <div id="adminPanel">
    </div>

    <!--Panel de Promotor una vez logeado-->
    <section id="promotorPanel" class="none">
        <div></div>
          <!--FORMULARIO DE REGISTRO DE CLIENTES (solo sera visible una vez logeado un promotor o accediendo con el admin a una ficha de promotor)--> 
    <div id="clientFormSubmit" class="none">
        <h2>Add New Client</h2>
        <form action="">
            <input type="text" value="Name">
            <input type="email">
            <input type="number">
            <button type="submit">Sign In</button>
        </form>
    </div>
    </section>

    <footer class="footer-container">
        <h4>Copyright: jdluis.com</h4>
    </footer>

    <script src="js/main.js"></script>
</body>
</html>


Mi codigo js a priori esta comentado en la linea del import, pero eso ya he comprobado que no es el problema, aun asi dejo mi function y el import:

    //import {Promotor} from './class.js';

    //Carga el contenido de todo el local Storagw y lo guarda en el array admins
function allStorage() {
  (keys = Object.keys(localStorage)), (i = keys.length);

  while (i--) {
    admins.push(JSON.parse(localStorage.getItem(keys[i])));
  }
  return admins;
}

Un saludo y gracias, mi codigo completo se puede ver en mi github aunque creo que no es necesario.

2
  • Mencionaste 2 veces que aparece un error, pero no cuál error. Pulsa en editar para mejorar tu pregunta. Lee Cómo preguntar y haz el recorrido de bienvenida para conocer el funcionamiento del sitio.
    – padaleiana
    Commented el 30 mar. 2022 a las 11:08
  • Muchas gracias, no especifique es verdad, ya lo actualice, el error es que no me carga nada del archivo js en el caso de poner type:modal... Me acabo de dar cuenta que el type lo ponia mal.. es decir la linea completa seria: <script src="js/main.js" type="module"></script> y no type="modal".....Era eso.. vaya fallo mas tonto, disculpa jaja
    – jdluis.com
    Commented el 31 mar. 2022 a las 8:51

1 respuesta 1

0

Chicos el único fallo era que no puse bien la palabra reservada module, en vez de eso puse modal...
La forma correcta de llamar a un type module es esta:

  <script src="js/main.js" type="module"></script>

Todo funciona bien, yo uso firefox versión developer en Manjaro(Linux).

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.