How to fix custom domain overwriting problem when using gh-pages deploy script
Yesterday I moved my GitHub pages based website to a custom domain. It was https://bernardodiasc.github.io and now it is https://bernardodiasdacruz.com. The steps to make this is pretty straightforward, there are many useful instructions available on GitHub docs: Using a custom domain with GitHub Pages
This project is based on create-react-app and for deployment step I choose to host on gh-pages, there are many different ways to make this task as easier as possible, I choose to go with the NPM gh-pages.
Problem arose and the solution
After the custom domain were changed, things was looking well, but each next deployments was clearing the custom domain setting on the GitHub repository, resulting the site to respond 404.
The solution wasn't clear in any docs but it's quite simple actually:
- Create a file called
CNAME
in the root of the site. In the create-react-app case, put this file in the/public
folder because that will be copied to/dist
when you runyarn build
, and the/dist
folder will become the root when you rungh-pages -d dist
; - Write your custom domain inside this file, in my case, was just one line with
bernardodiasdacruz.com
;
Commit and deploy, it should work!
You can check the solution for this site on the repo.