nginxnpmnext.jspm2

running next-js on Nginx server gives 404 error on resources and links


Im hosting nextJs site on nginx.

this is my config :

server {
        listen 80 default_server;
        listen [::]:80 default_server;
        root /var/www/html/;
        index index.html index.htm index.nginx-debian.html;

        server_name a.com;
        location / {
                proxy_pass http://localhost:3000;
                proxy_http_version 1.1;
                proxy_set_header Upgrade $http_upgrade;
                proxy_set_header Connection 'upgrade';
                proxy_set_header Host $host;
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                proxy_cache_bypass $http_upgrade;
                try_files $uri $uri/ =404;
        }

}

when i try to access my site its give me 404 error on statics :

enter image description here

and if i add this line the sites static loads well i cant naviage the site :

`       location /_next/static/ {
                alias /var/www/html/dist/static/;
                expires 365d;
                access_log off;
        }
`

and it gives me this error :

**_next/data returns 404 (NGINX)**

Im running my next.js with pm2 npm

changing the nginx config


Solution

  • you can try to remove the line of

    try_files $uri $uri/ =404;
    

    and by default nextjs build directory is .next/static you can try change alias path into

    location /_next/{
        alias /path/.next/;
        expires 365d;
        access_log off;
    }