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.