Deploying Angular app in a different folder than root folder

Question

New to Angular. App works fine if deployed in nginx /var/www/mydomain.com/html. But I want to deploy it in /var/www/mydomain.com/html/myapp folder. I setup nginx available sites to this folder and index.html works fine. But relative paths in Angular app (e.g., images/mypic.png) being attempted to be retrieved from /var/www/mydomain.com/html/images folder (hence 404 error code) instead of /var/www/mydomain.com/html/myapp/images folder. How do I set a url prefix /myapp globally in Angular so all relative paths have this prefix. I have seen some answers here but they require changes in the component code. Isn't there a way to made this setting at deployment time so the same dist can be deployed in any path?

Answer 1

On angular.json > build > options configuration add this line with target sub directory

        "baseHref" : "/v2/",
        "deployUrl": "/v2/",

**like this **

    "build": {
      "builder": "@angular-devkit/build-angular:browser",
      "options": {
        "baseHref" : "/v2/",
        "deployUrl": "/v2/",

Answer 2

Use the following command, here /myapp/ is the relative path to the root site.

ng build --prod --base-href /myapp/