[JS ES6]Problema con export e import

flopi01

Llevo un par de dias que no encuentro resolver un error que me da al intentar importar modulos en javascript, os pongo el codigo:

modules.js

export let hello = "Hello World!";

main.html

<script>
  import {hello} from "modules";

  console.log(hello);
</script>

Al ejecutar el codigo en el servidor (utilizo http-server de npm), me sale el siguiente error en consola:
SyntaxError: import declarations may only appear at top level of a module

Alguien tiene idea de porque no me deja importarlo, he buscado por internet pero no me ha quedado muy claro.

litoss

Por partes:

Para importar un modulo de tu proyecto deberias hacerlo con la ruta al mismo:

import {hello} from "./modules";

Y luego en el segundo código tienes puesta la etiqueta script de html en un archivo js con lo que deberia de darte error.

1 respuesta
flopi01

#2 El archivo main es en html, y el modulo esta en la misma ubicacion que el main.html

He probado tambien en poner la ruta con "./modules" y igual.

1 respuesta
litoss

#3 No puedes utilizar ES6 en el html, al menos sin haber transpilado la parte de js antes con babel por ejemplo.

1 respuesta
flopi01

#4 Ok gracias, le echare un ojo a babel.

Usuarios habituales

  • flopi01
  • litoss