Самый оптимальный способ импорта внешних библиотек в ReactJS - PullRequest
0 голосов
/ 27 февраля 2020

Например, у меня есть внешняя библиотека, такая как Materialize. js, компоненты, которые мне нужно визуализировать, зависят от нее, как лучше всего включить эту библиотеку? Документация ReactJS относится к разделению кода, которое я сделал с моим собственным JavaScript, но не могу сделать с внешним свернутым скриптом. Какой подход обеспечивает наивысшую производительность?

Я попробовал следующее

componentDidMount() {
    const script = document.createElement("script");
    script.src = "https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/js/materialize.min.js";
    script.async = true;
    script.onload = () => this.scriptLoaded();      
    document.body.appendChild(script);
}

scriptLoaded = async () => {
   this.setState({materializeJsLoaded: true});
}

Я также затем попытался включить его в индексную страницу. html внизу тега body .

<script type="text/javascript"  src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/js/materialize.min.js"></script>

1 Ответ

1 голос
/ 27 февраля 2020

Вот статья, в которой обсуждается создание пользовательской css сборки и импорт javascript для каждого компонента:

https://medium.com/@mattdlockyer / youre using-materialize- css -wrong-470b593e78e9

enter image description here

...