How to fix inconsistent trailing slashes in Gatsby
I first learned about the problem of inconsistent trailing slashes from Monica Lent in her article How to Uncover Non-obvious SEO Mistakes on Gatsby Websites.
Then I experienced it when seeing "double" entries like "/timeline/" and "/timeline" in my POW! Analytics reports.
This will happen if your internal links are inconsistent, but also if your internal links are consistently non-trailing slash while your hosting provider redirects from non-trailing to trailing URLs etc.
However, we no longer have to worry about getting it right; instead, you can configure Gatsby to make it consistent.
To do so, add trailingSlash
to your gatsby-config.js and choose between:
always
: Always add trailing slashes to each URL, e.g. /x to /x/.never
: Remove all trailing slashes on each URL, e.g. /x/ to /x.ignore
: Don't automatically modify the URL
I go for always
!
module.exports = {
plugins: [
// ...
],
trailingSlash: "always",
};
All the best,
Queen Raae