Search code examples
angularnginxsubdomainsubdirectory

Point angular app on subdomain to subfolder with nginx

I want to point sub.example.com to example.com/sub (without actually redirecting). I've achieved this with following nginx config:

server {
    listen 80;
    server_name ~^(.*)\.example\.com$ ;
    root /var/www/html/example.com/public_html/sub;
}

The problem is, I have an Angular app on sub.example.com and it tries to load its js resources from the below path and fails to do so (404 Not found): 

http://sub.example.com/sub/inline.bundle.js
http://sub.example.com/sub/vendor.bundle.js
...

To make a build I'm using following command: 

ng build --base-href /sub/

How to resolve this? Is this Angular issue or can I fix it with nginx config? I've tried the proxy_pass but with no success.

Solution

  • Specifying base-href is only needed for the router if your app is not served from the root location, e.g. http://example.com/sub

    In your case, you added nginx rules so that content can be served from a sub folder, but using a "root" location (http://sub.example.com)

    So from an angular point of view, everything is like it's served from a root folder, meaning there is no need to specify base-href