1

I have a React application built using the create-react-app starter. I am trying to deploy this application to Azure App service. When testing locally, everything is working as expected. When I go to deploy it using an image pushed to ACR via pipeline, the app is behaving differently and I'm getting an error not seen locally. When I build the image locally and push it to the ACR repository, bam the problem goes away. So there is something about the build pipeline causing different behavior. Any ideas how to troubleshoot something like this?

Here is the Dockerfile I'm using:

# build environment
FROM node:13.12.0-alpine as build
WORKDIR /app
ENV PATH /app/node_modules/.bin:$PATH
COPY package.json ./
COPY package-lock.json ./
RUN npm ci --silent
RUN npm install react-scripts@3.4.1 -g --silent
COPY . ./
RUN npm run build

# production environment
FROM nginx:stable-alpine
COPY --from=build /app/build /usr/share/nginx/html
# new
COPY nginx/nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

Here is the build definition in ADO:

# Docker
# Build and push an image to Azure Container Registry
# https://learn.microsoft.com/azure/devops/pipelines/languages/docker

trigger:
- master

resources:
- repo: self

variables:
  # Container registry service connection established during pipeline creation
  dockerRegistryServiceConnection: '3919c5b1-8ce6-4f6c-aa87-73632208d6a2'
  imageRepository: 'videoeffectsreact'
  containerRegistry: 'videoeffects.azurecr.io'
  dockerfilePath: '$(Build.SourcesDirectory)/Dockerfile'
  tag: '$(Build.BuildId)'
  
  # Agent VM image name
  vmImageName: 'ubuntu-18.04'

stages:
- stage: Build
  displayName: Build and push stage
  jobs:  
  - job: Build
    displayName: Build
    pool:
      vmImage: $(vmImageName)
    steps:
    - task: Docker@2
      displayName: Build and push an image to container registry
      inputs:
        command: buildAndPush
        repository: $(imageRepository)
        dockerfile: $(dockerfilePath)
        containerRegistry: $(dockerRegistryServiceConnection)
        tags: |
          $(tag)
          latest
Zachary Piazza
  • 11
  • 2
  • Check [this ticket](https://stackoverflow.com/questions/46929196/how-to-solve-npm-install-throwing-fsevents-warning-on-non-mac-os). The cause of the warning seems to be related with the platform. You could try to use the same platform as the local machine. But this warning may not affect many things. Could you please share more information about the error behavior and the build definition settings? – Kevin Lu-MSFT Jul 08 '20 at 06:20
  • I have updated to include the build definition. I will try some of the suggestions in that thread. – Zachary Piazza Jul 08 '20 at 14:56
  • Adding the force command does not resolve the issue. – Zachary Piazza Jul 08 '20 at 15:10
  • To solve this warning, you could use the `"fsevents": "2.1.2"` and run the build with Microsoft-hosted agent: `macOS-10.15` . But I still couldn't get the error behavior. Do you mean that the error behavior is the warning or other points? – Kevin Lu-MSFT Jul 10 '20 at 07:22
  • I just removed that from the post. I dont believe fsevents has anything to do with the issue im getting. – Zachary Piazza Jul 10 '20 at 15:55
  • given that this issue is 2 years old at this point, have you solved this issue? I am running into the same problem – Chris Kruining May 20 '22 at 13:45

0 Answers0