Vue-router+webpack single-page item routing on line deployment, refresh page 404 issues

With Vue project, when online deployment, access to the first page and through the route to open Level two page no problem, but a refresh will appear 404 phenomenon

Because the resource accessed when the page is refreshed is not found on the server, because the route set by Vue-router is not a real path.

The workaround is: The nginx.conf configuration is modified as follows:

Location/{
root HTML;
　　Try_files $uri $uri/@router;
Index index.html index.htm;
}

Location @router {
Rewrite ^.*$/index.html last;
}

The red font is the added configuration, then save the restart Nginx can be resolved.

Vue-router+webpack single-page item routing on line deployment, refresh page 404 issues