Using Create React App with Gitlab Pages

Using Gitlab pages with your static react app created with create-react-app is not hard. Simply add the .gitlab-ci.yml file to the root of your project.

.gitlab-ci.yml

image: node:16

pages:
  cache:
    paths:
      - ./node_modules/

  stage: deploy
  script:
    - npm install
    - npm run build
    - mv build/* public/
  artifacts:
    paths:
      - public
  only:
    - master

And make sure your homepage is set properly in package.json

{
  "name": "gitlab-pages-react-app",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.3.2",
    "react-dom": "^16.3.2",
    "react-scripts": "1.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },
  "homepage": "."
}

Here is an example repository: https://gitlab.com/meesvandongen/gitlab-pages-react-app

And example pages site: https://meesvandongen.gitlab.io/gitlab-pages-react-app/