使用maven搭建springboot+vue3的项目

以下是使用 Maven 搭建 Spring Boot + Vue3 项目的步骤：

1. 创建一个 Maven 项目

在你的 IDE 中创建一个 Maven 项目，可以选择使用 Spring Initializr 快速生成一个 Spring Boot 项目骨架。

2. 添加 Spring Boot 依赖

在 pom.xml 文件中添加 Spring Boot 的依赖，例如：

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

3. 添加 Vue3 依赖

在 pom.xml 中添加 Vue3 的依赖，例如：

<dependency>
    <groupId>org.webjars.npm</groupId>
    <artifactId>vue@3.0.0</artifactId>
    <version>3.0.0</version>
</dependency>

注意：这里使用了 WebJars，需要在项目中添加 WebJars 的依赖。

4. 配置 Maven 插件

在 pom.xml 文件中配置 Maven 插件，用于编译 Vue3 代码。例如：

<build>
    <plugins>
        <plugin>
            <groupId>com.github.eirslett</groupId>
            <artifactId>frontend-maven-plugin</artifactId>
            <version>1.10.0</version>
            <executions>
                <execution>
                    <id>install node and npm</id>
                    <goals>
                        <goal>install-node-and-npm</goal>
                    </goals>
                    <configuration>
                        <nodeVersion>v12.16.2</nodeVersion>
                        <npmVersion>6.14.4</npmVersion>
                    </configuration>
                </execution>
                <execution>
                    <id>npm install</id>
                    <goals>
                        <goal>npm</goal>
                    </goals>
                    <configuration>
                        <arguments>install</arguments>
                    </configuration>
                </execution>
                <execution>
                    <id>npm build</id>
                    <goals>
                        <goal>npm</goal>
                    </goals>
                    <configuration>
                        <arguments>run build</arguments>
                    </configuration>
                </execution>
            </executions>
        </plugin>
    </plugins>
</build>

这里使用了 frontend-maven-plugin 插件来编译 Vue3 代码。

5. 创建 Vue3 项目

在项目根目录下创建一个名为 vue 的文件夹，用于存放 Vue3 项目代码。

在 vue 文件夹下执行以下命令，创建一个 Vue3 项目：

vue create .

这里使用了点号（.）表示当前目录。

6. 配置 Vue3 项目

在 vue 文件夹下创建一个 vue.config.js 文件，用于配置 Vue3 项目。例如：

module.exports = {
    outputDir: "../src/main/resources/static",
    indexPath: "../static/index.html",
    devServer: {
        proxy: {
            "/api": {
                target: "http://localhost:8080"
            }
        }
    }
}

这里将 Vue3 项目的输出目录设置为 src/main/resources/static，将 Vue3 项目的入口文件设置为 static/index.html，并配置了代理，将所有以 /api 开头的请求转发到 http://localhost:8080。

7. 编译项目

在项目根目录下执行以下命令，编译项目：

mvn clean install

这里会自动编译 Vue3 项目，并将编译后的代码打包到 jar 包中。

8. 运行项目

在 target 目录下找到生成的 jar 包，执行以下命令，运行项目：

java -jar your-project.jar

这里需要将 your-project.jar 替换为实际的 jar 包名称。

9. 访问应用

在浏览器中访问 http://localhost:8080，即可看到运行的应用。

以上就是使用 Maven 搭建 Spring Boot + Vue3 项目的步骤，希望对你有所帮助！