How to inject specific CSS/JS in head section of page in Gatsby.js

[RejaurRahman]

I am currently working on a Gatsby.js project.

Right now the page has a header component which consists of a burger menu component and navigation, as well as a footer component.

When viewing the site on chrome when selecting under performance tab slow 3G the burger menu does not toggle, which means the script for the burger menu is not inside the head component.

The styling is fine as I believe critical CSS is rendered inside HEAD by Gatsby.js automatically.

So, my question is, how can I inject critical CSS or JS from component/external files inside the head of the page.

Any advice/tips/help will be really appreciated, as I am kinder stuck on this.

Kind Regards,

Ronny