Idea实现springboot+vue项目整合

1.首先在Idea中分别创建一个vue项目一个springboot项目(前面文章说过),右键uve项目,新创建一个子项目,New->Module

Idea实现springboot+vue项目整合_第1张图片

2.选择Maven->Next

Idea实现springboot+vue项目整合_第2张图片

3.填写项目名称,选择Finish

Idea实现springboot+vue项目整合_第3张图片

这样就创建好了一个springboot项目

Idea实现springboot+vue项目整合_第4张图片

但是由于这样的springboot项目缺少组件,pom文件中缺少很多依赖,所以最好将我们之前创建好的springboot项目导入进来

4.删除springboot项目的src和pom.xml

Idea实现springboot+vue项目整合_第5张图片

5.将最初创建完成的springboot项目中的src和pom.xml复制到整合项目的子项目springboot项目中,之后新建一个文件夹vue

Idea实现springboot+vue项目整合_第6张图片

将项目文件夹中node_modules,public,src,babel.config.js,package.json,package-lock.json全部移动到vue文件夹中,这样项目就形成了非常清晰的前后端分离项目,前端使用vue,后端使用springboot!

注意!!!!!!!!!!!!!!!

要是项目中pom.xml中的标签project显示报错,如下图所示:

Idea实现springboot+vue项目整合_第7张图片

首先检查Maven是否已经选中选对位置:

Idea实现springboot+vue项目整合_第8张图片

若已经选中还是报错,可以更换pom文件中springboot版本,更换成:


		org.springframework.boot
		spring-boot-starter-parent
		2.2.5.RELEASE
		 
	

就成功啦!!!

6.启动项目

Idea实现springboot+vue项目整合_第9张图片

启动成功!!!!!!!!!!!!!!!

你可能感兴趣的:(java,vue.js,spring,boot,intellij-idea,大数据,运维)