download：极客工夫训练营高级Java工程师体系课2023版2.0

用SpringBoot和Vue3开发古代Web利用
随着Web利用的日益遍及，前后端拆散的架构形式越来越受到欢送。在这种状况下，应用SpringBoot和Vue3是一个不错的抉择。本文将介绍如何应用SpringBoot和Vue3构建古代Web利用。

筹备工作
在开始之前，咱们须要确保咱们曾经装置了以下软件：

Java SDK 11 或以上
Node.js 和 npm
Vue CLI 4
IntelliJ IDEA 或 Eclipse
创立SpringBoot我的项目
首先，咱们须要创立一个SpringBoot我的项目。能够通过IntelliJ IDEA或Eclipse来实现这个工作。如果你应用IntelliJ IDEA，能够依照以下步骤来创立一个SpringBoot我的项目：

关上IntelliJ IDEA并抉择“Create New Project”。
抉择“Spring Initializr”我的项目类型，并单击“Next”。
在下一步中，填写你的我的项目信息，例如项目名称、形容、包名、Java版本等，并单击“Next”。
抉择你须要增加的组件，但不要抉择“Spring Web”，因为咱们会在前面手动增加它。单击“Next”。
最初，抉择你的我的项目存储地位，并单击“Finish”。
当初，咱们曾经胜利地创立了一个SpringBoot我的项目。

增加Spring Web依赖
接下来，咱们须要增加Spring Web依赖以反对Web服务。在pom.xml文件中，增加如下依赖：

xml
<dependency>

<groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</artifactId>

</dependency>
创立Vue3我的项目
当初，咱们须要创立一个Vue3我的项目。能够通过Vue CLI来实现这个工作。在终端窗口中执行以下命令：

vue create my-app
其中，“my-app”是你的项目名称。

运行Vue3我的项目
接下来，咱们须要运行Vue3我的项目。在终端窗口中执行以下命令：

cd my-app
npm run serve
当初，咱们曾经胜利地创立了一个Vue3我的项目，并且曾经能够在浏览器中看到它的成果。

集成SpringBoot和Vue3
当初，咱们须要将SpringBoot和Vue3集成在一起。首先，咱们须要将Vue3编译为动态资源并将其复制到SpringBoot我的项目的“resources/static”目录中。能够通过批改Vue3我的项目的“vue.config.js”文件来实现这一点：

javascript
module.exports = {

outputDir: '../src/main/resources/static',indexPath: '../static/index.html'

}
而后，在SpringBoot我的项目的“application.properties”文件中增加以下配置项：

spring.mvc.view.prefix=/static/
spring.mvc.view.suffix=.html
最初，咱们须要在SpringBoot我的项目中创立一个控制器类来解决申请。例如，以下代码将返回Vue3的首页：

java
@Controller
public class HomeController {

@GetMapping("/")
public String home() {

return "index";

}

}
当初，咱们曾经胜利地将SpringBoot和Vue3集成在一起。

论断
本文介绍了如何应用SpringBoot和Vue3构建古代Web利用。首先，咱们创立了一个SpringBoot我的项目并增加了Spring Web依赖。而后，咱们创立了一个Vue3我的项目并运行它。