CODEWITHSUNDEEP
angularnginxdeploymentproduction-environment
Laamiri Oussema
Laamiri Oussema

Reputation: 527

Serve angular-cli from dist folder with nginx

I'm trying to serve my angular-cli application from the dist folder using nginx I used this command to generate dist

ng build --prod

then I moved the dist folder to my server and this is my nginx configuration:

server {
    listen 80;

    server_name x.x.x.x;


    location /angular {

        proxy_http_version 1.1;
        root /usr/share/nginx/html/dist;
        index index.html index.htm;
        try_files $uri $uri/ angular/dist/index.html;
    }

}

now when I try to reach x.x.x.x/angular I got 404 Not Found

Whats wrong with my configuration?

Upvotes: 4

Views: 12025

Answers (1)

viks
viks

Reputation: 1398

  • Make sure you have <base href="/"> in you index.html head tag.

  • You have to use the following command to build:

    ng build --prod --base-href http://x.x.x.x

  • Now check your nginx server configuration and restart nginx.

    server {

    listen 80;

    server_name http://x.x.x.x;

    root /path/to/your/dist/location;

    index index.html index.htm;

    location / {

        try_files $uri $uri/ /index.html;

        # This will allow you to refresh page in your angular app. Which will not give error 404.

    }

}

For more information check this answer.

Hope it will be helpful.

Upvotes: 4

Related Questions