一般vue工程会单独部署到nginx服务器上，但是也有些会跟后端服务一起打包部署，这里简单介绍一种方法。
首先在已有的项目中添加静态资源映射：
@Configuration
public class MvcConfig extends WebMvcConfigurationSupport {
@Autowired
private ConfigProperties configProperties;
@Override
protected void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/static/**").addResourceLocations(ResourceUtils.CLASSPATH_URL_PREFIX + "/static/");
super.addResourceHandlers(registry);
}
}然后再resources目录创建static目录，将vue打包后的dist目录下的所有文件copy到static下即可。
启动项目访问：http://ip:port/static/index.html
当然这么做有一点不方便，前端修改代码后端也需要重新打包，所以我们可以映射到项目外
@Configuration
public class MvcConfig extends WebMvcConfigurationSupport {
@Autowired
private ConfigProperties configProperties;
@Override
protected void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/static/**").addResourceLocations(ResourceUtils.CLASSPATH_URL_PREFIX + "/static/");
registry.addResourceHandler(configProperties.getPath()).addResourceLocations("file:" + configProperties.getResourceLocations());
super.addResourceHandlers(registry);
}
}我们将资源路径做成可配置：
@Configuration
@ConfigurationProperties(prefix = "view")
@Data
public class ConfigProperties {
private String path;
private String resourceLocations;
}
配置文件：
server:
port: 8080
spring:
application:
name: test
profiles:
active: dev
view:
path: /demo/**
# D:/work/dist/
resourceLocations: D:/work/dist/
这样就实现可配置部署vue工程，将vue打包好的dist目录路径配置到resourceLocations，访问路径配置到path
按照上面配置，启动项目访问：http://ip:port/demo/index.html
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之家整理，本文链接：https://www.bmabk.com/index.php/post/5340.html
