Getting 404 for static assets in vue cli project

Question

I am finding it hard to deploy a project with vue webpack template. We are serving a Laravel app with nginx in our server. So opening www.example.com serves our laravel installation. Now I wanted to use www.example.com/lite to serve the lite version of the app which is an SPA build with vue-webpack template. And for that I created a location block in our nginx configuration

location /lite {
                # First attempt to serve request as file, then
                # as directory, then fall back to displaying a 404.
                #try_files $uri $uri/ =404;
                index  index.html index.htm;
                alias /var/www/html/crm-lite/dist;
                try_files $uri $uri/ /index.html;
        }

And I have changed assetsPublicPath to assetsPublicPath: '/lite' in build/index.js; But when I open it on browse I am getting 404 not found for the static assets. The url looks like this http://example.com/lite/static/js/app.3c11ea8ceff19f8f33ff.js

If i copy the contents of the dist/ folder into our document root and open it with only ip address it works fine. Is there any configuaration i am missing? Thanks for help.

I am guessing that you have a conflicting location block for URIs ending with .js. Try using: location ^~ /lite { ... } instead. — Richard Smith
– Richard Smith, Commented Dec 10, 2017 at 10:22

jascotty2 · Accepted Answer · 2017-12-10 11:08:00Z

1

alias is not a terribly reliable method for moving a page, I've found; but it does offer the unique ability to redirect static requests to another folder outside of the parent, which is nice.

I played with your config for a bit before I figured out what was going on: you missed the trailing / in the directory path. (PS, you don't need the try_files or index directives)

Try this:

location /lite {
    alias /var/www/html/crm-lite/dist/;
}

answered Dec 10, 2017 at 11:08

jascotty2

312 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Getting 404 for static assets in vue cli project

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related