2
votes

I'm trying to build my React app in a Bitbucket pipeline, and then deploy it using a git push to my production server.

This works fine when I put everything in one step, like so:

image: node

clone:
  depth: full
pipelines:
  default:
    - step:
        name: Build app
        caches:
          - node
        script:
          - yarn
          - yarn build
          - git config user.email "<email>"
          - git config user.name "<name>"
          - git config remote.origin.url <remote ssh>
          - git add .
          - git commit -m "Add build"
          - git push

However, I would like to split the build process and the deploy process into separate steps. Later on, I will also add tests to the build step.

This is what I tried:

image: node

clone:
  depth: full
pipelines:
  default:
    - step:
        name: Build app
        caches:
          - node
        script:
          - yarn
          - yarn build
    - step:
        name: Deploy to production
        deployment: production
        script:
          - git config user.email "<email>"
          - git config user.name "<name>"
          - git config remote.origin.url <remote ssh>
          - git add .
          - git commit -m "Add build"
          - git push

This passes, but doesn't produce a difference on my production server (as opposed to the first way I did it above). I assumed this was because a new step would mean a new container, and that new container would thus not have access to the build I did in the previous step.

I tried to get around that with artifacts, but to no avail. I can't seem to find a way to get my build from the first step into the second step.

Anyone have any advice?

1

1 Answers

2
votes

The executed commands and their resulting files are not persisted between steps, so you will need to use artifacts in order for the files produced by yarn in the first step to still be available in the second step. So if your yarn for example writes the files to the folder yarn-output in the root of the project your pipeline would become:

image: node

clone:
  depth: full
pipelines:
  default:
    - step:
        name: Build app
        caches:
          - node
        script:
          - yarn
          - yarn build
        artifacts:
          - yarn-output/**
    - step:
        name: Deploy to production
        deployment: production
        script:
          - git config user.email "<email>"
          - git config user.name "<name>"
          - git config remote.origin.url <remote ssh>
          - git add .
          - git commit -m "Add build"
          - git push