How to fix error in deployment of React app on Azure Container apps?
FuriousOne
0
Reputation points
I was able to deploy my code and image successfully on Google Cloud Run. But the same setup is resulting in error while deploying on Azure Container Apps. Would you please suggest what could be cause and how it can be fixed?
I am executing the command:
az containerapp up
Here is the error that I receive:
The command failed with an unexpected error. Here is the traceback:
[WinError 3] The system cannot find the path specified: './node_modules\\@babel\\plugin-proposal-nullish-coalescing-operator\\node_modules\\@babel\\helper-function-name\\node_modules\\@babel\\types\\lib\\builders\\flow\\createTypeAnnotationBasedOnTypeof.js'
Here is my dockerfile content:
FROM node:16-alpine as build-step
WORKDIR app/
# ENV PATH /app/node_modules/.bin:$PATH
# COPY package.json yarn.lock ./
# COPY package.json yarn.lock tsconfig.json ./
# COPY src/ ./src
# COPY public/ ./public
COPY . ./
RUN yarn
RUN yarn build
# Build step #2: build the API with the client as static files
FROM python:3.11.2-bullseye
# Allow statements and log messages to immediately appear in the Knative logs
ENV PYTHONUNBUFFERED True
WORKDIR app/
COPY --from=build-step app/build ./build
RUN mkdir ./api
COPY api/ ./api
RUN pip3 install -U pip && pip3 install --no-cache-dir -r ./api/requirements.txt
ENV QUART_ENV $QUART_ENV
# EXPOSE $PORT
WORKDIR /app/api
# CMD exec gunicorn --bind :$PORT --workers 1 --threads 8 --timeout 0 main:flask_app
CMD exec hypercorn --bind :$PORT main:quart_app
Here is my package.json dependencies:
"dependencies": {
"@date-io/moment": "^2.15.0",
"@emotion/react": "^11.7.1",
"@emotion/styled": "^11.6.0",
"@formkit/auto-animate": "^1.0.0-beta.6",
"@lottiefiles/react-lottie-player": "^3.4.9",
"@mui/core": "^5.0.0-alpha.54",
"@mui/icons-material": "^5.2.5",
"@mui/material": "^5.4.0",
"@mui/x-date-pickers": "^5.0.0-beta.5",
"@testing-library/jest-dom": "^5.16.1",
"@testing-library/react": "^12.1.2",
"@testing-library/user-event": "^13.5.0",
"@types/jest": "^27.4.0",
"@types/node": "^16.11.19",
"@types/superagent": "^4.1.15",
"@types/underscore": "^1.11.4",
"firebase": "^9.9.0",
"js-cookie": "^3.0.1",
"moment": "^2.29.4",
"query-string": "^7.1.1",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-firebase-hooks": "^5.0.3",
"react-ga4": "^1.4.1",
"react-hook-form": "^7.25.3",
"react-iframe": "^1.8.5",
"react-router-dom": "^6.2.1",
"react-scripts": "5.0.0",
"typescript": "^4.7.4",
"underscore": "^1.13.2",
"universalify": "^2.0.0",
"web-vitals": "^2.1.3"
},
"devDependencies": {
"@types/react": "^17.0.2",
"@types/react-dom": "^17.0.2"
}