Aquí está mi archivo de índice
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta content="IE=Edge" http-equiv="X-UA-Compatible"> <meta name="description" content="test"> <title>test</title> </head> <body> <!-- <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@2.0.0/dist/tf.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/fetch-polyfill@0.8.2/fetch.js"></script> --> <script src="https://unpkg.com/@babel/standalone/babel.min.js"></script> <script src="/app.js" type='text/babel'></script> <script type="text/javascript"> fnc(); </script> </body> </html>Y aquí está el archivo app.js
function fnc() { console.log('myname'); }Me pregunto por qué la consola dice:
Uncaught ReferenceError: fnc is not defined at (index):19 (anonymous) @ (index):19Si cambio el tipo de script con texto/javascript, funciona sin problema. Sin embargo, necesito que sea un script babel para que el script tensorflow funcione en IE11.
¿Alguien puede ayudarme?
Además de la respuesta de @CertainPerformance ,
Si desea llamar a la función fnc() directamente, entonces el tipo debe ser text/babel , porque está definido en babel y transpiled . Si usa text/javascript , lo buscará en el objeto de window .
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script> <script src="/app.js" type='text/babel'></script> <script type="text/babel"> //<-- not text/javascript fnc(); // works fine </script>Lo que hace Babel es transpilar código en sintaxis moderna a sintaxis más antigua. Este puede ser un proceso intensivo, por lo que no transpila las etiquetas de secuencias de comandos inmediatamente , sino que las transpila de forma asincrónica. Babel no transpiló app.js en el momento en que se ejecuta la etiqueta de secuencia de comandos en línea.
Si bien podría agregar un retraso o agregar alguna forma de detectar cuándo se ejecuta realmente el script transpilado, una mejor manera de lidiar con algo como esto sería poner todo el código en el script que se transpila, para que no obtenga condiciones de carrera. como estas.
Un enfoque aún mejor sería transpilar el script por adelantado y alojarlo y cargarlo en su página. Babel Standalone no es una buena idea para usar en producción, porque puede ser bastante pesado: es mejor poner el esfuerzo de procesamiento en su servidor , una vez, al transpilar, que en cada cliente cada vez que cargan la página.
Entonces podrías tener algo como
<script src="/transpiledApp.js"></script> <script type="text/javascript"> fnc(); </script>y simplemente funcionaría.