Как сделать проксирование nginx на Vue.js 3 SPA

Есть проект (возьмем за пример название domain.ru). Приложение написано на vue.js 3 как SPA. После билда есть папка dist, где лежит все, включая единственный html - index.html.

Задача такая: есть внутренний роут /:id (vue-router), который переводит на страницу ресторана (например, bestrestaurant возьмем). Соответственно, у ресторана есть страница - domain.ru/bestrestaurant. Задача - сделать еще каждому ресторану поддомен.

То есть, человек должен обратиться по ссылке bestrestaurant.domain.ru - в адресной строке он и видит этот адрес, но по факту происходит проксирование на domain.ru/bestrestaurant.

В адресной строке должно оставаться bestrestaurant.domain.ru. Проект лежит на VPS ubuntu, там накручен nginx, конфигурация nginx следующая:

server {
        listen 80;
        server_name domain.ru;
    
        root /app/domain/dist;
    
        location / {
            try_files $uri $uri/ /index.html;
        }
    }
    
    server {
        listen 80;
        server_name subdomain.domain.ru;
    
        location / {
            root /app/domain/dist;
            index index.html;
            include /etc/nginx/mime.types;
            try_files $uri $uri/ /index.html;
            proxy_pass http://127.0.0.1:80/subdomain;
       }
    }

При попытке обратиться на domain.ru или же domain.ru/subdomain - все отлично.

При попытке обратиться на subdomain.domain.ru я получаю следующее: страница белая, во вкладке "сеть" devTools Chrome я вижу 200 статусы, но все мои файлы (шрифты, js чанки, стили и тд и тп) имеют в ответе index.html. В консоли разработчика ошибка:

/assets/index-fabbf7fd.js:1 Failed to load module script: Expected a
JavaScript module script but the server responded with a MIME type of 
"text/html". Strict MIME type checking is enforced for module scripts per HTML spec.