Estoy tratando de usar un complemento de Javascript TypeIt para un reactjs (versión 17.2). Aunque tiene npm, estoy tratando de usar la versión simple de vanilla js.
No puedo resolver esto.
He usado el siguiente enlace para inyectar secuencias de comandos en el cuerpo
import { useEffect } from 'react'; const useScript = resourceUrl=> { useEffect(() => { const script = document.createElement('script'); script.src = resourceUrl; script.async = true; console.log(script) document.body.appendChild(script); return () => { document.body.removeChild(script); } }, [resourceUrl]); }; export default useScript;En el componente estoy usando el siguiente código
import React, {useEffect, useRef} from 'react' import useScript from '../../Hooks/useScript' const TypeText = () => { useScript('vendor/typeTextScript.js') // useScript('https://unpkg.com/typeit@8.0.6/dist/index.umd.js') const typeTrigger = useRef() useEffect(()=> { setTimeout(() => { new TypeIt(typeTrigger.current, { strings: "This is my string!", speed: 75, loop: true, }).go(); }, 100); },[]) return ( <> <h1>This is a TypeText component</h1> <p ref={typeTrigger}></p> </> ) } export default TypeTextRecibo el siguiente error: TypeIt no está definido. ¿Me puedes ayudar?
No sé por qué no quiere usar npm para instalar ese paquete, pero esto es lo que debe hacer:
agregue la propiedad de type a su script para que el navegador sepa cómo manejarlo
const useScript = (resourceUrl: string) => { useEffect(() => { const script = document.createElement("script"); script.src = resourceUrl; script.async = true; script.type = "text/javascript"; // you need to add this line console.log(script); document.body.appendChild(script); return () => { document.body.removeChild(script); }; }, [resourceUrl]); };