Custom Javascript is not applied to gatsby project #26239
Unanswered
sanjaydhamelia26
asked this question in
Help
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Summary
I am newbies to Gatsby Framework and we are targeting to migrate our existing react web application to gatsby.
In our existing project we have used a slider, achieved with the JavaScript.
As there in no index.html file in GatsbyJS like react application in which we have added some of the styles and custom JS file in
<head>
and<body>
So in order to migrate the JS file we have done the following the steps:
<Helmet>
react componentWhile doing all above implementation following are the result.
1) customizing html.js
--> Custom JS applied successfully
--> But when I navigate to other page and coming back again then script was disabled
2) The gatsby-ssr.js API file
--> Added all scripts in
setPostBodyComponents
hook--> Verify it is added before
</body>
--> But style won't applied successfully
3) Using
<Helmet>
react component--> Custom JS applied successfully
--> But when I navigate to other page and coming back again then script was disabled
Relevant information
For a reference purpose i am attaching the sample demo project.
Some information about attached project
Component :
testPage.js
contains list of images in a div with the respective class<div className="slider fslider">..<img>... </div>
Scripts list required for the project
<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"/>
Above script has been placed where it is required in all three respective implementation specified in summary section.
================================= Attachement ==============================
import-script.zip
================================= ========================================
Beta Was this translation helpful? Give feedback.
All reactions