I have a create-react-app with minor adjustments to configuration (adding a set of aliases with react-app-rewire -- see config-overrides.js). I have added environment variables to my .env file: (1) HOST=mavata.dev; (2) DANGEROUSLY_DISABLE_HOST_CHECK=true; (3) DISABLE_ESLINT_PLUGIN=true; (4) GENERATE_SOURCEMAP=false; (5) SKIP_PREFLIGHT_CHECK=true; (6) INLINE_RUNTIME_CHUNK=false. My index.js file simply imports bootstrap.js, a file that renders the App components into the root id div of my index.html.
When I try running the react app with npm run start with a start script of set port=9000 && react-app-rewired start it takes me to mavata.dev:9000 in the browser where the page will not load due to a ERR_SSL_PROTOCOL_ERROR error saying "This site can’t provide a secure connection: mavata.dev sent an invalid response." I tried changing the start script to set port=9000 && set HTTPS=true && set SSL_CRT_FILE=./reactcert/cert.pem SSL_KEY_FILE=./reactcert/key.pem && react-app-rewired start after creating a certificate but get the same error.
When I try running the react app in my Kubernetes cluster using skaffold (port-forwarding), I navigate to mavata.dev an get a 404 Not Found Nginx error saying "GET https://mavata.dev/ 404".
How can I get my react app to be hosted over mavata.dev (i have it set to both 127.0.0.1 and 0.0.0.0 in my hosts file on my local machine)? Whether through npm run start or from skaffold dev --port-forward?
*** config-overrides.js ***:
const path = require('path');
module.exports = {
webpack:
(config, env) => {
config.resolve = {
...config.resolve,
alias: {
...config.alias,
'containerMfe': path.resolve(__dirname, './src/'),
'Variables': path.resolve(__dirname, './src/data-variables/Variables.js'),
'Functions': path.resolve(__dirname, './src/functions/Functions.js'),
'Company': path.resolve(__dirname, './src/roots/company'),
'Auth': path.resolve(__dirname, './src/roots/auth'),
'Marketing': path.resolve(__dirname, './src/roots/marketing'),
}
};
return config;
},
}
*** Client Deployment***:
apiVersion: apps/v1
kind: Deployment # type of k8s object we want to create
metadata:
name: client-depl
spec:
replicas: 1
selector:
matchLabels:
app: client
template:
metadata:
labels:
app: client
# tier: frontend
spec:
containers:
- name: client-container
# image: us.gcr.io/mavata/frontend
image: bridgetmelvin/frontend
ports:
- containerPort: 9000
---
apiVersion: v1
kind: Service
metadata:
name: client-srv
spec:
selector:
app: client
ports:
- name: client-container
protocol: TCP
port: 9000
targetPort: 9000
Ingress-Srv.yaml:
# RUN: kubectl apply -f https://raw.githubusercontent.com/kubernetes/ingress-nginx/controller-v1.4.0/deploy/static/provider/cloud/deploy.yaml
# for GCP run: kubectl create clusterrolebinding cluster-admin-binding --clusterrole cluster-admin --user $(gcloud config get-value account)
# then run: kubectl apply -f kubectl apply -f https://raw.githubusercontent.com/kubernetes/ingress-nginx/controller-v1.4.0/deploy/static/provider/cloud/deploy.yaml
apiVersion: networking.k8s.io/v1
kind: Ingress
metadata:
name: ingress-srv
annotations:
kubernetes.io/ingress.class: nginx
nginx.ingress.kubernetes.io/use-regex: 'true'
nginx.ingress.kubernetes.io/rewrite-target: /
spec:
rules:
- host: mavata.dev
http:
paths:
- path: /api/users/?(.*)
pathType: Prefix
backend:
service:
name: auth-srv
port:
number: 4000
- path: /?(.*)
pathType: Prefix
backend:
service:
name: client-srv
port:
number: 9000
*** Dockerfile.dev ***:
FROM node:16-alpine as builder
ENV CI=true
ENV WDS_SOCKET_PORT=0
ENV PATH /app/node_modules/.bin:$PATH
RUN apk add --no-cache sudo git openssh-client bash
RUN apk add bash icu-libs krb5-libs libgcc libintl libssl1.1 libstdc++ zlib
RUN git config --global user.email "bridgetmelvin42@gmail.com"
RUN git config --global user.name "theCosmicGame"
RUN mkdir -p -m 0600 ~/.ssh && ssh-keyscan git.mdbootstrap.com >> ~/.ssh/known_hosts
RUN cd ~/.ssh && ls
WORKDIR /app
ENV DOCKER_RUNNING=true
ENV CI=true
COPY package.json ./
COPY .env ./
COPY postinstall.js ./
COPY pre-mdb-install.sh ./
COPY postinstall.sh ./
RUN npm config set unsafe-perm true
RUN npm install
RUN bash postinstall.sh
RUN ls node_modules
COPY . .
CMD ["npm", "run", "start"]
