Tengo dos archivos javascript separados debido a que necesito ejecutar uno como type="module" en mi html (ya que estoy importando una biblioteca matemática de https://mathjs.org/index.html ) y necesito ejecutar uno as type="text/javascript" (ya que la función que contiene no se ejecutaría dentro de un módulo por algún motivo).
Aquí está el primer archivo js, app.js:
var turn = "X" function play(cell) { cell.value = turn; grid[1][2] = X; console.log(grid[1][2]) if(turn == "X") { turn = "O" } else { turn = "X" } cell.disabled = true; }Aquí está el otro archivo js, mathimport.js:
import 'math.js' import 'mathjs' var grid = [[0,0,0],[0,0,0],[0,0,0]] export {grid}Aquí está la parte importante de mi html:
<head> <link rel="stylesheet" href="style.css"> <script type="text/javascript" src="app.js" defer></script> <script type="module" src="mathimport.js" defer></script> </head> Como puede ver, intento acceder a grid desde mathimport.js dentro de app.js, pero sigo recibiendo este error:
Uncaught ReferenceError ReferenceError: grid is not defined at play (c:\Users\C2Ran\Practice\Game\app.js:5:5) at onclick (c:\Users\C2Ran\Practice\Game\index.html:16:82) ¿La grid no debería estar definida globalmente? ¿Por qué app.js no puede acceder a él? Y finalmente, ¿por qué no puedo definir mi función dentro de un módulo en primer lugar?
Necesita importar grid en el archivo app.js
Así: - ìmport {grid} from 'mathimport.js'
Si desea utilizar las exportaciones de un módulo, ese módulo no puede ser el punto de entrada para el programa. Las exportaciones no se convierten en globales.
El código que necesita usarlo debe importarlo, lo que requiere que sea un módulo.
<script type="module" src="mathimport.js" defer></script> .<script type="text/javascript" src="app.js" defer></script> un móduloimport mathimport.js dentro de app.js Entonces tendrás que hacer algo con el play para usarlo. Actualmente app.js solo lo define. Nunca lo llama/lo asigna como controlador de eventos/etc.