spring-boot - 在本地开发期间动态更新前端和后端之间的传输层(vue.js、axios 和 spring-boot)？

Question

我有一个基于以下的前端/后端项目:

https://jaxlondon.com/blog/java-core-languages/put-spring-boot-und-vue-js-practical-use-project-tutorial/

我可以通过运行以下命令使用 hotload 开发前端的 UI 部分:

npm install
npm run serve

但是我如何针对正在运行的后端测试我在前端的更改 - 例如如果我只想在前端对后端 API 进行不同的调用？

现在，当我想构建和运行后端时，我运行:

mvn clean install
java -jar backend/target/backend-1.0.0-SNAPSHOT.jar

这将首先构建前端，将前端文件复制到后端，构建后端，最后启动/运行它。

但是每次我想在前端尝试对后端 API 的不同调用时，我都不想经历那条完整的路径。

我看过 spring-boot-devtools :

https://www.google.com/url?sa=t&rct=j&q=&esrc=s&source=web&cd=3&cad=rja&uact=8&ved=2ahUKEwi01Le6x8LmAhXCDOwKHTrUDmQQFjACegQIAhAB&url=https%3A%2F%2Fwww.vojtechruzicka.com%2Fspring-boot-devtools%2F&usg=AOvVaw3LfvxbQ-5ZW33tG8gFJjoL

是的，我可以通过运行主类从我的 Eclipse IDE 启动后端，但我仍然需要它来单独启动前端或以某种方式在正在运行的后端动态更新前端资源(当更改时)。

但我仍然不知道如何将前端源代码热重载到正在运行的后端。

当然我可以将前端和后端分开，这样后端只包含API(而不是前端资源)并独立启动它。但在此之前，我想看看我是否可以使用我现有的项目完成上述开发过程。

关于如何进行的任何建议/指示？

Answer 1

我在我的个人项目上也做了同样的事情。我可以详细给你看看有没有帮助

https://github.com/reflexdemon/problem-generateor是一个主要为后端编写的 Spring Boot 应用程序。我在里面有一个子文件夹 ui/vue-ui/ ，这主要是使用我的 Spring Boot 应用程序的 UI 项目。

我已经设置了我的 UI 项目，在进行本地开发时，我可以使用代理 https://github.com/reflexdemon/problem-generateor/blob/master/ui/vue-ui/vue.config.js 指向我的 Spring Boot 应用程序。 .

此设置将使本地开发工作正常，事实上，在我的本地进行开发时，我有能力指向部署在远程 PC 上的真实服务，以便能够为我服务。

这里有一些额外的事情，

始终指向所有 /api指向后端，这样代理配置很简单

构建好的包复制到src/main/resources/static/这样在部署 Spring Boot 应用程序时，它可以作为单个可部署工件

您可以让两个模块独立工作。