Резюме Я новичок в Gatsby Framework, и мы планируем перенести существующее веб-приложение реагирования на gatsby.
Так как в файле index. html в Gatsby JS как приложение реакции, в которое мы добавили некоторые стили и пользовательский файл JS в <head>
и <body>
, чтобы перенести JS файл, мы выполнили следующие шаги:
- Настройка html. js (https://www.gatsbyjs.org/docs/custom-html/#reach -skip-nav )
- Файл API gatsby-ssr. js (https://www.gatsbyjs.org/docs/api-files-gatsby-ssr/)
- Использование
<Helmet>
компонента реакции
При выполнении всех вышеперечисленных реализаций ниже приведены результат.
1) настройка html. js
-> Пользовательский JS успешно применен
-> Но когда Я перехожу на другую страницу и возвращаюсь снова, тогда скрипт был отключен
2) Файл gatsby-ssr. js API
-> Добавлен все скрипты в setPostBodyComponents
hook
-> Убедитесь, что он добавлен перед </body>
-> Но стиль не будет успешно применен
3 ) Использование компонента реакции
-> Пользовательский JS успешно применен
-> Но когда я перехожу на другую страницу и возвращаюсь снова, скрипт был отключен
Соответствующая информация Я прилагаю образец демонстрационного проекта для справки. Некоторая информация о прикрепленном проекте
Component: testPage. js содержит список изображений в div с соответствующим классом <div className="slider fslider">..<img>... </div>
Список скриптов, необходимых для проекта <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"/> <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js'/> <script src="https://getbootstrap.com/docs/4.5/dist/js/bootstrap.bundle.min.js"/> <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'/> <script src='https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.5.8/slick.min.js'/> <script src="./script.js"/>
Вышеупомянутый скрипт был размещен там, где он требуется во всех трех соответствующих реализациях, указанных в сводном разделе.
Я загрузил проект в сообщение на github. См. Последнюю отформатированную строку опубликованного вопроса import-script.zip