I have a cluster setup on google cloud with one of the deployments being containerized Angular app on nginx:

apiVersion: apps/v1
kind: Deployment
metadata:
  name: product-adviser-front-deployment
  labels:
    app: angular-front
    version: v1
spec:
  replicas: 1
  selector:
    matchLabels:
      name: product-adviser-front-deployment
  template:
    metadata:
      labels:
        name: product-adviser-front-deployment
    spec:
      containers:
        - name: product-adviser-front-app
          image: aurrix/seb:product-adviser-front
          imagePullPolicy: Always
          ports:
            - containerPort: 80
          env:
            - name: API_URL
              value: http://back:8080/
          readinessProbe:
            initialDelaySeconds: 30
            httpGet:
              path: /healthz
              port: 80
          livenessProbe:
            initialDelaySeconds: 30
            httpGet:
              path: /healthz
              port: 80
      restartPolicy: Always
---
apiVersion: v1
kind: Service
metadata:
  name: front
spec:
  selector:
    name: product-adviser-front-deployment
  ports:
    - port: 80
  type: NodePort

Nginx configuration:

    worker_processes auto;

    error_log  /var/log/nginx/error.log warn;
    pid        /var/run/nginx.pid;


    events {
    worker_connections 1024;
    }


http {
        #Allow CORS
        add_header 'Access-Control-Allow-Origin' '*';
        add_header 'Access-Control-Allow-Credentials' 'true';
        add_header 'Access-Control-Allow-Headers' 'Authorization,Accept,Origin,DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Content-Range,Range';
        add_header 'Access-Control-Allow-Methods' 'GET,POST,OPTIONS,PUT,DELETE,PATCH';

        log_format gzip '[$time_local] ' '"$request" $status $bytes_sent';
        index         index.html;
        include       /etc/nginx/mime.types;
        default_type  application/javascript;

        access_log /dev/stdout;
        charset utf-8;

        sendfile        on;
        keepalive_timeout  65;

        #include /etc/nginx/conf.d/*.conf;

        server {
            listen       80;
            listen       [::]:80;
            server_name  localhost;

            access_log /dev/stdout;

            root /usr/share/nginx/html;

            location / {
                try_files $uri $uri/ /index.html;
            }

            error_page   500 502 503 504  /50x.html;
            location = /50x.html {
            root   /usr/share/nginx/html;
            }

            location ~* \.(jpg|jpeg|png|gif|ico|css|js)$ {
            try_files $uri $uri/ =404;
            }

            location /healthz {
            return 200 'no content';
            }

        }
        # Compression
        #include       /etc/nginx/gzip.conf;
}

Ingress:

apiVersion: extensions/v1beta1
kind: Ingress
metadata:
  name: main-ingress
  annotations:
    kubernetes.io/ingress.class: nginx
    nginx.ingress.kubernetes.io/rewrite-target: /
spec:
  rules:
    - http:
        paths:
          - path: /
            backend:
              serviceName: front
              servicePort: 80

Whenever I am visiting the external IP address, angular app responses with index.html, however, fails to load resources.

I am pretty sure it somehow related to ingress configuration but I think already exhausted myself trying to figure this out.

What am I doing wrong here?

As a side note, I have installed ingress-nginx to my cluster, it seems to be working fine. base href is present in index.html. The docker image works perfectly fine locally.