How can I safely remove all references to Gatsby in a Gatsby-built static site?
For example, the default html.js
(in .cache/default-html.js
) contains:
import React from "react"
import PropTypes from "prop-types"
export default function HTML(props) {
return (
<html {...props.htmlAttributes}>
<head>
<meta charSet="utf-8" />
<meta httpEquiv="x-ua-compatible" content="ie=edge" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no"
/>
{props.headComponents}
</head>
<body {...props.bodyAttributes}>
{props.preBodyComponents}
<noscript key="noscript" id="gatsby-noscript">
This app works best with JavaScript enabled.
</noscript>
<div
key={`body`}
id="___gatsby"
dangerouslySetInnerHTML={{ __html: props.body }}
/>
{props.postBodyComponents}
</body>
</html>
)
}
HTML.propTypes = {
htmlAttributes: PropTypes.object,
headComponents: PropTypes.array,
bodyAttributes: PropTypes.object,
preBodyComponents: PropTypes.array,
body: PropTypes.string,
postBodyComponents: PropTypes.array,
}
And this results in <div id="___gatsby"><div style="outline:none" tabindex="-1" role="group" id="gatsby-focus-wrapper">
in the source code of each of my pages.
I want to remove the string gatsby
from all of my pages that is included by default (and not ones where I explicitly add it in - for example, I might add <div>This site was built by gatsby</div>
to the page footer).
According to the docs, you can customize html.js to edit the HTML outside of the core Gatsby application.
However this might not help you because it also states that
Inside your
<body>
you must have a div with an id of___gatsby
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With