Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Publish your create-react-app website via Gitlab CI. tags: #gitlab #git #deploy #ci
image: node:6.5.0 # can be upgraded, depending on your node version used
pages:
stage: deploy
script:
- npm install
- npm run build
- rm -rf public
- mv build public
artifacts:
paths:
- public # mandatory, other folder won't work
only:
- master # or dev, the branch you want to publish
@calvinw

This comment has been minimized.

Copy link

calvinw commented Jan 1, 2017

Nice!!

Just an addition. I was able to get this working in gitlab by adding the line:
"homepage": "https://user.gitlab.io/projectname",

to the package.json. This is the same fix that is needed to publish to github pages.

Thanks for putting this up!

@kud

This comment has been minimized.

Copy link
Owner Author

kud commented Apr 7, 2017

@calvinw Thanks. Good to know. :)

@ReneCode

This comment has been minimized.

Copy link

ReneCode commented Dec 6, 2017

Thanx, that helps me to get started.

@yarnball

This comment has been minimized.

Copy link

yarnball commented Jan 20, 2018

Nice one!

If you want to speed up the build pipeline, cache your node_modules folder (as per below) 👍

Note: gitlab takes a few minutes after the pipeline passes for your page to appear.

image: node:6.5.0 # can be upgraded, depending on your node version used
 
pages:
  cache:
    paths:
    - node_modules/
 
  stage: deploy
  script:
  - npm install
  - npm run build
  - rm -rf public
  - mv build public
  artifacts:
    paths:
    - public # mandatory, other folder won't work
  only:
  - master # or dev, the branch you want to publish
@chandresh87

This comment has been minimized.

Copy link

chandresh87 commented Apr 12, 2018

Hi ,

I did the same but when I am trying to hit the homepage URL it is giving me 404. Please help.
I am doing something wrong with setting up of homepage ?
"homepage": "https://gitlab.com/app_name"

My project is saved in repo as https://gitlab.com/xyz/app_name

@sh4hids

This comment has been minimized.

Copy link

sh4hids commented Jun 27, 2018

@chandresh87 you did a little bit wrong. The homepage url will be:

"homepage": "https://xyz.gitlab.io/app_name"
@aleturolla

This comment has been minimized.

Copy link

aleturolla commented Nov 9, 2018

Hi,
I used your config and the pipeline passed correctly.
I set my GitLab Pages homepage via package.json like @calvinw suggested, but I can't see anything on my page...

Can you help me?


EDIT: Solved it! It was a problem with React Router.
Since my homepage is https://xyz.gitlab.io/project-name/, I had to set the basename prop of BrowserRouter to /project-name.

I just leave the comment here, if someone encounters the same problem!

@CoderGregH

This comment has been minimized.

Copy link

CoderGregH commented Dec 30, 2018

Hi,
I used your config and the pipeline passed correctly.
I set my GitLab Pages homepage via package.json like @calvinw suggested, but I can't see anything on my page...

Can you help me?

EDIT: Solved it! It was a problem with React Router.
Since my homepage is https://xyz.gitlab.io/project-name/, I had to set the basename prop of BrowserRouter to /project-name.

I just leave the comment here, if someone encounters the same problem!

Very helpful @aleturolla that saved me some time today.

@rohanarihant

This comment has been minimized.

Copy link

rohanarihant commented Jan 15, 2019

Hi,
I have created a sample application using create-react-app.I was facing the same 404 error, then I set the basename prop of BrowserRouter as suggested by @aleturolla after that I start working.
application link :- https://gitlab.com/Rohanarihant/mobx

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.