vue+element+echarts项目打包出现的问题总结(跨域请求后台&element图标&echarts is not defined)
1.如何打包项目(打包后放入tomcat||nginx中)
2.出现空白
出现空白查看F12,加载文件的路径地址是否正确
3.跨域(SpringBoot 2.x.x 之后的)
package com.lgcx.common.config;
import org.springframework.boot.web.servlet.FilterRegistrationBean;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
@Configuration
public class CrosConfig implements WebMvcConfigurer {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**").allowedOrigins("*").allowedMethods("POST", "GET", "PUT", "OPTIONS", "DELETE")
.allowCredentials(true).allowedHeaders("*").maxAge(3600);
}
/**
* cors support
*
* @return
*/
@Bean
public FilterRegistrationBean corsFilter() {
// 注册CORS过滤器
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
CorsConfiguration config = new CorsConfiguration();
config.setAllowCredentials(true); // 是否支持安全证书
config.addAllowedOrigin("*"); // 允许任何域名使用
config.addAllowedHeader("*"); // 允许任何头
config.addAllowedMethod("*"); // 允许任何方法(post、get等)
// 预检请求的有效期,单位为秒。
// config.setMaxAge(3600L);
source.registerCorsConfiguration("/**", config);
FilterRegistrationBean bean = new FilterRegistrationBean(new CorsFilter(source));
bean.setOrder(0);
return bean;
}
}
4.element小图标展示
5.echarts is not defined
参考博客:https://blog.csdn.net/cuandeqin2083/article/details/88390249