Нужно интегрировать бесплатные шаблоны из https://startbootstrap.com/' в мое приложение реакции

Question

Я хочу скачать один из бесплатных шаблонов начальной загрузки и добавить указанный шаблон в мое приложение реакции.Я попытался прочитать некоторые документы, но не могу найти документацию по интеграции этих бесплатных шаблонов с реагированием.

Я сделал npm install для понравившегося мне шаблона, но я не уверен, что делать дальше,У меня просто есть шаблон в моем каталоге node_modules.

Я взял то, что было в теле html-файла в шаблоне, и бросил его в ответ на мой app.js.Добавлены папки css и vendor.Затем я попытался импортировать файл css шаблонов в мой app.js, а также изменить то, что было необходимо в моем файле index.html.Некоторые из них работали.Другие части этого не сделали.

Просто хочу правильно интегрировать эти красивые шаблоны в мои проекты.

Любая помощь будет принята с благодарностью!

Answer 1

Проблема в том, что эти шаблоны созданы с учетом Bootstrap , а не Реагируют.Эти шаблоны были созданы с использованием обычного HTML, CSS, JS, jQuery и т. Д. И не будут работать "из коробки" для приложения React.Таким образом, чтобы заставить один из этих шаблонов работать в контексте React, нужно будет вручную внести изменения в многочисленные части указанного шаблона.

Например, помимо захвата частей шаблона, требуемого для вашего приложения React, необходимо изменить многочисленные атрибуты, перечисленные на HTML-страницах, предоставленных шаблоном.Это связано с тем, что в React нельзя использовать ключевые слова, зарезервированные для JavaScript, в JSX .

Так что же это значит?

Вам придется изменить атрибуты class в HTML на className, чтобы ваши правила стиля CSS вступили в силуиз шаблона.onchange становится onChange, onsubmit становится onSubmit и т.д.может определенно заставить этот шаблон работать в React, просто потребуется ручная настройка на вашем конце .Однако, если вы хотите, чтобы шаблон работал из коробки для React, я бы посмотрел бесплатный шаблон, созданный с учетом React.

Надеюсь, это поможет!