I am generating a build from webpack. But whenever it generates a build it creates an index.html
file along with other files but in the index.html
it adds script
tags with the suffix "/". I want to add a configuration in webpack to just add the name of the files of different assets instead of the suffix "/"
My index.html:
<head>
<meta charSet="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="generator" content="Gatsby 2.1.19" />
<link as="script" rel="preload" href="/component---src-templates-all-pokemon-js-d59d33d2742ee8d7199e.js" />
<link as="script" rel="preload" href="/app-a6912420758bcc3e24a1.js" />
<link as="script" rel="preload" href="/webpack-runtime-65c9ddc0802b64490fd8.js" />
<link as="fetch" rel="preload" href="/static/d/382/path---index-6a9-UNWMCjcHKgbI17oOwICQKH7zPs.json"
crossorigin="use-credentials" />
</head>
But I want it like this for each and everything.
<head>
<meta charSet="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="generator" content="Gatsby 2.1.19" />
<link as="script" rel="preload" href="component---src-templates-all-pokemon-js-d59d33d2742ee8d7199e.js" />
<link as="script" rel="preload" href="app-a6912420758bcc3e24a1.js" />
<link as="script" rel="preload" href="webpack-runtime-65c9ddc0802b64490fd8.js" />
<link as="fetch" rel="preload" href="static/d/382/path---index-6a9-UNWMCjcHKgbI17oOwICQKH7zPs.json"
crossorigin="use-credentials" />
</head>
I know that I have to change my webpack configurations, but I am unable to do that for all the asset files in a Gatsby. I want to do it for each and every file I am loading from my browser.
I don't think there is any way of removing the beginning slash but if your gatsby site is not the root of your domain, for example www.example.com/blog/
you can use path prefix.
From the documentation
There are two steps for building a site with path prefixes.
- First define the prefix in your site’s gatsby-config.js.
gatsby-config.js
module.exports = { // Note: it must *not* have a trailing slash. pathPrefix: `/blog`, }
Then pass
--prefix-paths
cmd option to Gatsby.
gatsby build --prefix-paths
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