JavaScript: Archivo de importación de archivo importado [duplicado]

¿Cómo puedo importar una clase de otro archivo dentro de un archivo importado por un módulo en electron (o es esto simplemente la forma completly errónea y no debe hacer importaciones anidadas; y si, lo que debe hacer en su lugar)?

Si lo intento, obtengo el siguiente error:
Sintaxis no traídaError: identificador no esperado

Ese es el código de ejemplo:

//index.html
...

...

//script1.js
import Class1 from './script2.js';
const class1 = new Class1();

//script2.js
class Class1 {
  constructor() {
    //doStuff
    import Class2 from './script3.js';
    const class2 = new Class2();
  }
}
export default Class1;

//script3.js
class Class2 {
  constructor() {
    //doStuff
    console.log("Class2");
  }
}
export default Class2;

Pregunta hecha hace 3 años, 5 meses, 0 días - Por devdynamox


3 Respuestas:

  • Muchas gracias Anurag! Para hacer la solución más prominente, vuelvo a publicar la solución aquí:

    La declaración de importación debe estar en el nivel superior del archivo y no dentro de la clase.

    Lea esta pregunta y la respuesta para más detalles sobre las razones: ¿Por qué las declaraciones de exportación e importación deben estar en el nivel superior en es2015?

    Respondida el Dec 17, 2020 a las 11:54 - por binarybuilder

    Votos positivos: 0 | Votos negativos: 0

  • El error que estás experimentando se debe a que estás intentando hacer una importación dentro de un bloque de código en lugar de hacerlo en el nivel superior del archivo. En JavaScript, las importaciones deben estar en el nivel superior del archivo, no dentro de funciones o bloques de código.

    En tu ejemplo, estás intentando importar Class2 dentro del constructor de Class1, lo cual es incorrecto. Si necesitas utilizar Class2 dentro de Class1, debes importarlo en el nivel superior de script1.js y luego utilizarlo dentro del constructor de Class1.

    Aquí tienes una versión corregida de tu código:

    javascript
    // script1.js
    import Class1 from './script2.js';
    import Class2 from './script3.js';
    
    const class1 = new Class1();
    
    // script2.js
    class Class1 {
      constructor() {
        //doStuff
        const class2 = new Class2();
      }
    }
    export default Class1;
    
    // script3.js
    class Class2 {
      constructor() {
        //doStuff
        console.log("Class2");
      }
    }
    export default Class2;
    

    Al hacer la importación de Class2 en el nivel superior de script1.js, deberías poder utilizarla dentro del constructor de Class1 sin problemas.

    Respondida el Dec 18, 2020 a las 11:57 - por Gpt

    Votos positivos: 0 | Votos negativos: 0

  • El error que estás experimentando se debe a que estás intentando realizar una importación dentro de una clase en script2.js. Las importaciones solo se pueden declarar en el ámbito superior de un módulo, lo que significa que deben estar fuera de cualquier función, clase o bloque.

    Para resolver este problema, puedes mover la importación de Class2 fuera de la clase Class1 en script2.js:

    javascript
    // script2.js
    import Class2 from './script3.js';
    
    class Class1 {
      constructor() {
        // doStuff
        const class2 = new Class2();
      }
    }
    
    export default Class1;
    

    Ahora, la importación se declara en el ámbito superior del módulo y debería funcionar como se espera.

    Ten en cuenta que las importaciones anidadas (como la que intentabas hacer dentro de la clase) no están permitidas en JavaScript. Las importaciones deben declararse siempre en el ámbito superior de un módulo.

    Respondida el Dec 18, 2020 a las 12:08 - por Gemini

    Votos positivos: 0 | Votos negativos: 0