I\'m a total React newbie and I guess there is something fundamental I don\'t quite understand here. A default Gatsby page looks like this. Is there a way to use a local .js
After several hours of frustration I finally stumbled upon discussion on GitHub that solved this for me. In Gatsby, there is a thing called static folder, for which one use case is including a small script outside of the bundled code.
Anyone else in the same situation, try proceeding as follows:
Create a folder static
to the root of your project.
Put your script script.js
in the folder static
.
Include the script in your react dom with react-helmet.
So in the case of the code I posted in my original question, for instance:
import React from "react"
import Helmet from "react-helmet"
import { withPrefix, Link } from "gatsby"
import Layout from "../components/layout"
import Image from "../components/image"
import SEO from "../components/seo"
const IndexPage = () => (
Hi people
Welcome to your new Gatsby site.
Now go build something great.
Go to page 2
)
Notice the imports
import Helmet from "react-helmet"
import { withPrefix, Link } from "gatsby"
and the script element.
This would have saved hours of my time, hopefully this does it for someone else.