vuejs-templates / webpack

A full-featured Webpack + vue-loader setup with hot reload, linting, testing & css extraction.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Can't render UI, if assetsPublicPath != '/'

ayulit opened this issue · comments

I have an application based on Vue.js at front-end and Spring Boot at back-end.

My production app isn't in the root of the server and it is a sub-path in localhost:8090/ui. Here is my application.yml:

server:
  port: 8090
  servlet:
    contextPath: /ui

I set assetsPublicPath: '/ui' in config/index.js so all my references in index.html are like /ui/static/...

According to Google Chrome, my production server successfully returns all my static assets, like localhost:8080/ui/static/images/example.png but I can't see my UI for some reason.
enter image description here

As I've implemented my front-end as a single page application, I configured my server, using WebAutoConfig to redirect all to index.html like this:

@Configuration
public class WebAutoConfig implements WebMvcConfigurer {
    public void addViewControllers(ViewControllerRegistry registry) {
        registry.addViewController("/")
                .setViewName("forward:/index.html");
    }
}

Also I use mode: 'history' property in router\index.js. Without it everything works fine, but I don't want ugly hashes in URL, like localhost:8090/ui/#/. Moreover, everything works fine even with history mode enabled, but without sub-path, i.e. contextPath: /
enter image description here

Thank you