Блог

Мне нужно импортировать https://youglish.com/public/emb/widget.js в свой проект React и использовать его YG в качестве функции. В принципе, мне нужен этот виджет в моем веб-приложении React. Я смог использовать его метку. но мне нужно включить функцию YG в приложение React.

вы также можете рассмотреть https://youglish.com/api/doc/js-api

Методы, которые я пробовал до сих пор!

1.

 import 'https://youglish.com/public/emb/widget.js'

const Widget = () => {
    const widget = new YG.Widget("widget-1");
    widget.fetch("courage", "english");
  };

  return (
    <>
      <Widget />

.....
 

 import YG from "YG";

 useEffect(() => {
    const script = document.createElement("script");
    script.src = "https://youglish.com/public/emb/widget.js";
    script.async = true;
    document.body.appendChild(script);
  }, []);

const Widget = () => {
    const widget = new YG.Widget("widget-1");
    widget.fetch("courage", "english");
  };

  return (
    <>
      <Widget />

.....

added in index.html dody
<script
      async
      src="https://youglish.com/public/emb/widget.js"
      charset="utf-8"
    ></script>

errors: 
Failed to compile.

./src/App.tsx
Module not found: Can't resolve 'YG' in '/Users/.../Documents/Apps/Projects/.../src'