### 创建 Vue 和
Spring Boot 集成项目所需依赖
在
IntelliJ IDEA 中创建一个集成了 Vue 前端和
Spring Boot 后端的项目时，需要确保前后端各自拥有合适的依赖项。以下是详细的依赖列表：
#### Maven POM 文件中的
Spring Boot 依赖
对于后端部分，即 `hrserver` 文件夹下的
Spring Boot 应用程序，POM 文件应包含以下核心依赖[^4]：
```xml
<dependencies>
<!
-- Spring Web
-->
<dependency>
<groupId>org.
springframework.
boot</groupId>
<artifactId>
spring-boot-starter
-web</artifactId>
</dependency>
<!
-- MySQL Connector
Java -->
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql
-connector
-java</artifactId>
<scope>runtime</scope>
</dependency>
<!
-- MyBatis Framework
-->
<dependency>
<groupId>org.mybatis.
spring.
boot</groupId>
<artifactId>mybatis
-spring-boot-starter</artifactId>
<version>2.2.0</version>
</dependency>
<!
-- Other dependencies as needed
-->
<!
-- Test Dependencies
-->
<dependency>
<groupId>org.
springframework.
boot</groupId>
<artifactId>
spring-boot-starter
-test</artifactId>
<scope>test</scope>
</dependency>
</dependencies>
```
这些依赖涵盖了 RESTful API 支持、数据库连接以及测试框架。
#### package.json 文件中的 Vue CLI 依赖
针对前端部分，位于 `vuehr` 文件夹内的 Vue.js 工程，则应在 `package.json` 文件中声明如下关键模块[^5]:
```json
{
"name": "vuehr",
"version": "1.0.0",
"private": true,
"scripts": {
"serve": "vue
-cli
-service serve",
"build": "vue
-cli
-service build"
},
"dependencies": {
"axios": "^0.21.1", // HTTP client to interact with backend
services
"core
-js": "^3.6.5",
"vue": "^2.6.11",
"vue
-router": "^3.2.0"
}
}
```
此配置引入了 Axios 来处理HTTP请求，并设置了 Vue Router 实现单页面
应用路由功能。
为了使两者协同工作，还需设置跨域资源共享(CORS)，并调整 Vue 的 `src/main.js` 文件以便于与后台服务通信:
```
javascript
import Vue from 'vue'
import App from './App.vue'
import router from './router'
// 设置反向代理，让前端请求默认发送至 http://localhost:8443/api/
var axios = require('axios')
axios.defaults.baseURL = 'http://localhost:8443/api/'
Vue.prototype.$axios = axios
Vue.config.productionTip = false
new Vue({
el: '#app',
router,
render: h => h(App)
})
```
以上就是在
IntelliJ IDEA 下构建基于
Spring Boot 和 Vue 技术栈的
应用所必需的主要依赖描述。
本文详细指导如何在SpringBoot项目中添加新服务，解决隐藏配置问题，以及优化EditConfigurations设置。重点包括自动启动未添加的应用和配置重置技巧。
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
