Por alguna razón, mi página html no puede encontrar una clase que coloqué en otro archivo js.
En el encabezado hice referencia al archivo.
<script type="module" src="../class1.js"></script>En una etiqueta de secuencia de comandos en la página HTML, trato de crear una instancia de la clase
let class1 = new class1();La clase 1 es una clase secundaria de la clase base y parece
class baseClass { constructor() { } } class class1 extends baseClass { constructor() { super(); } }Has cargado tu archivo como un módulo. Eso significa que las declaraciones de nivel superior no son globales. En su lugar, exportaría cualquier cosa que el módulo deba exportar e importarlo donde lo necesite. Su ejemplo de código no le muestra haciendo eso (aunque es posible que haga una exportación en algún lugar que no haya mostrado).
Aquí hay un ejemplo de cómo puede exportarlos (tenga en cuenta la palabra clave de export ):
export class baseClass { constructor() { } } export class class1 extends baseClass { constructor() { super(); } }Y luego en el código que necesita usarlo:
import {class1} from "./class1.js"; // ...use it here... Tenga en cuenta que si tiene un módulo de punto de entrada principal, no necesita incluir elementos de script para las cosas que importa. Solo importando es suficiente.
Por ejemplo, si la clase anterior está en class1.js y el código que la usa está en main.js , este HTML es todo lo que necesita para cargarlos:
<script src="./main.js" type="module"></script> La acción de cargar main.js carga los módulos de los que depende.
Nota al margen: puede usar cualquier convención de nomenclatura en su código que desee, pero cuando comparte código con otros, es mejor ceñirse a la convención de nomenclatura abrumadoramente común de que las funciones del constructor (como class1 ) comienzan con un carácter en mayúscula ( Class1 ).