如何将vue3打包后的程序放到springboot中一起打包
时间: 2024-03-02 13:41:51 浏览: 250
将Vue3打包后的程序放到Spring Boot中一起打包的方法如下:
1. 在Vue3中使用命令`npm run build`编译生成静态文件
2. 在Spring Boot中创建`src/main/resources/static`目录
3. 将Vue3编译生成的静态文件放到`src/main/resources/static`目录下
4. 在Spring Boot项目中使用Maven或Gradle进行打包
5. 打包完成后,在浏览器中访问`http://localhost:8080`即可看到Vue3的页面。
注意事项:
1. 在Vue3中使用路由时,需要配置Spring Boot的路由规则,避免访问不到页面
2. 在Vue3中使用API请求时,需要配置Spring Boot的跨域规则,避免API请求被拦截
相关问题
vue打包后放到springboot
1. 在Vue项目中运行 `npm run build` 命令,该命令会将Vue项目打包成静态文件。
2. 将打包后的文件夹(dist文件夹)复制到Spring Boot项目的src/main/resources/static目录下。
3. 在Spring Boot项目中创建一个Controller用于返回Vue静态页面,示例代码如下:
```
@RestController
public class ViewController {
@GetMapping("/")
public String index() {
return "index";
}
}
```
4. 在Spring Boot项目中配置静态资源访问路径,示例代码如下:
```
@Configuration
public class WebMvcConfig implements WebMvcConfigurer {
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/**")
.addResourceLocations("classpath:/static/");
}
}
```
5. 启动Spring Boot项目,在浏览器中访问`http://localhost:8080`即可访问Vue打包后的静态页面。
vue打包后如何在springboot中再次打包
可以将Vue的打包文件放到Spring Boot的静态资源文件夹中,然后通过Spring Boot的Maven插件进行打包。具体步骤如下:
1. 在Vue项目中执行npm run build命令,生成打包后的静态文件。
2. 将生成的dist文件夹复制到Spring Boot项目的src/main/resources/static目录下。
3. 在Spring Boot项目的pom.xml文件中添加以下Maven插件配置:
```xml
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
<executions>
<execution>
<goals>
<goal>repackage</goal>
</goals>
</execution>
</executions>
</plugin>
</plugins>
</build>
```
4. 执行mvn package命令,即可将Spring Boot应用和Vue打包文件一起打包成一个可执行的jar包。
注意:打包后的访问路径为http://localhost:8080/index.html,可以通过配置Spring Boot的视图解析器,使访问路径变为http://localhost:8080/。
阅读全文