插入外部脚本会在React中导致CSS样式错误

Question

我正在尝试将聊天插入我的React网站（https://www.tawk.to/）

当我插入他们的小部件脚本时，由于CSS覆盖（我正在使用样式组件库来设置项目样式），我的网站外观会发生变化。

此外，当我导航到其他页面（使用React Router库）时，出现以下错误：

Trying to insert a new style tag, but the given Node is unmounted!
* Are you using a custom target that isn't mounted?
* Does your document not have a valid head element?
* Have you accidentally removed a style tag manually?"

我尝试将以下代码粘贴到ReactDOM.render（）之外以及componentDidMount（）方法的组件中。两种情况都没有任何区别。

let s1 = document.createElement('script');
let s0 = document.getElementsByTagName('script')[0];
s1.async = true;
s1.src = 'https://linkToExternalJavaScriptFile';
s1.charset = 'UTF-8';
s1.setAttribute('crossorigin', '*');
s0.parentNode.insertBefore(s1, s0);

如何防止CSS覆盖并摆脱提到的错误消息？