Tengo un archivo html donde importo un módulo JS de chessboard.js
<html lang="en"> <head> <link rel="stylesheet" href="./chessboardFiles/css/chessboard-1.0.0.min.css" /> <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> <script id="import" src="./chessboardFiles/js/chessboard-1.0.0.js"></script> <title></title> </head> <body> <div id="board1" style="width: 400px"></div> <script> var board2 = Chessboard("board1", "start"); </script> </body> </html> El único problema es que quiero escribir lo que hay en la etiqueta <script> del cuerpo en un archivo JS separado y luego agregarlo a este documento html a través de <script src='...'> sin embargo <script id="import" ...> El archivo que se importa no es exactamente un módulo, por lo que no puedo simplemente import * as C from chessboard-1.0.0.js en un nuevo archivo JS porque obtengo un
Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec. error en la consola.
Entonces, ¿hay alguna forma de obtener las variables disponibles en el documento HTML (es decir, Chessboard()) disponible en un archivo JS externo? ¿Cómo podría hacer esto?
Puede escribir en variables de ventana globales o tener todo en el ámbito de la ventana. Ej: window.board = Chessboard(...) , y puede acceder a eso desde diferentes archivos si el script se ejecuta más tarde que la definición.