Как загрузить сторонние библиотеки в изоморфных приложениях реагировать?

Я пытаюсь использовать библиотеку чередования, в частности элементы чередования, чтобы я мог настроить пользовательскую форму для обработки платежей. Я использую Mern-Starter в файле server.js У меня есть следующий код. Вы можете видеть, что внизу я добавил тег script для импорта полосы. Тем не менее, в моей клиентской папке есть компонент, который пытается использовать полосу, и он не может получить к ней доступ. Я предполагаю, что он еще не знает, что он существует, но как я могу обойти эту проблему? Я рассмотрел компонент реагирования, который конкретно занимается загрузкой скриптов, но он не казался отличным решением. Мне просто интересно, знает ли кто-нибудь еще лучший способ. Я знаю, что мог бы использовать обратный вызов и получить эту диспетчеризацию и действие (используя REDUX), когда загрузка будет завершена, и только после этого я смогу выполнить мой код чередования, но опять же это кажется довольно раздражающим. Любые идеи по этому вопросу будут оценены.

return `
<!doctype html>
<html>
  <head>
    ${head.base.toString()}
    ${head.title.toString()}
    ${head.meta.toString()}
    ${head.link.toString()}
    ${head.script.toString()}

    ${process.env.NODE_ENV === 'production' ? `<link rel='stylesheet' href='${assetsManifest['/app.css']}' />` : ''}
    <link href='https://fonts.googleapis.com/css?family=Lato:400,300,700' rel='stylesheet' type='text/css'/>
    <link rel="shortcut icon" href="http://res.cloudinary.com/hashnode/image/upload/v1455629445/static_imgs/mern/mern-favicon-circle-fill.png" type="image/png" />
  </head>
  <body>
    <div id="root">${html}</div>
    <script>
      window.__INITIAL_STATE__ = ${JSON.stringify(initialState)};
      ${process.env.NODE_ENV === 'production' ?
      `//<![CDATA[
      window.webpackManifest = ${JSON.stringify(chunkManifest)};
      //]]>` : ''}
    </script>
    <script src='${process.env.NODE_ENV === 'production' ? assetsManifest['/vendor.js'] : '/vendor.js'}'></script>
    <script src='${process.env.NODE_ENV === 'production' ? assetsManifest['/app.js'] : '/app.js'}'></script>
    <script src='https://js.stripe.com/v3/'></script>
  </body>
</html>`;
Источник

1 ответ

Ваша проблема в том, что ваши прикладные скрипты выполняются раньше stripe.js был загружен.

положил <script src='https://js.stripe.com/v3/'></script> в голове или, по крайней мере, до вашего приложения (app.js в этом случае).

Источник
Другие вопросы по тегам