• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

174
Views
ReactJs agrega un complemento de Javascript de terceros

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 TypeText

Recibo el siguiente error: TypeIt no está definido. ¿Me puedes ayudar?

almost 3 years ago · Juan Pablo Isaza
1 answers
Answer question

0

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]); };
almost 3 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error