jquery not loading

[vallard]

Thanks for this cool template. I'm trying to make the navbar toggler work, I don't see jquery loading anywhere, which I think is necessary. Is there a way to add that in or check if its working? Seems to be so in yarn when I installed all dependencies. Just doesn't seem to be doing anything in the browser. Thanks for any pointers.

[jonnyeom]

The starter integrated the css portion automatically but it does not load js automatically.

What I did was

Require the jquery and popper.js libraries.

npm install jquery popper.js --save-dev

And then import them where I needed it. e.g.

import 'jquery/dist/jquery.min'
import 'popper.js/dist/popper.min'
import 'bootstrap/js/dist/util'
import 'bootstrap/js/dist/carousel'

I think the documentation could be updated to explain this.

[jaxx2104]

@jonnyeom
Thank you for the polite explanation on my behalf.

@vallard
I think I'll put it in the README.

[jonnyeom]

@jaxx2104 Before you do, I found that the method I used above works during gatsby develop but not during gatsby build.
instead of that method, I am now using a gatsby-browser.js.

I simply created a gatsby-browser.js file at the root of the project, and added all of my js dependencies.

// Import all js dependencies.
import 'jquery/dist/jquery.min.js'
import 'popper.js/dist/popper.min'
import 'bootstrap/js/dist/util'
import 'bootstrap/js/dist/carousel'
import 'bootstrap/js/dist/dropdown'

All this does is import these dependencies on all gatsby pages.

Because these js utilities are used on most of my pages, I am okay with this.
But I with I could get individual imports of JS dependencies per component file working correctly.

[jaxx2104]

👍
https://github.com/jaxx2104/gatsby-starter-bootstrap/releases/tag/2.1.0