从 POM 文件开始
其实 gradle 也是大同小异, 就不再一一介绍了, 就从 maven 文件下手吧
其实最关键的就是在已有的 SpringBoot 项目中, 添加一个整合 React 的 plugin.
这个 plugin 的名称就是 frontend-maven-plugin, 配置安装 node/npm/webpack:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
<plugin> <groupId>com.github.eirslett</groupId> <artifactId>frontend-maven-plugin</artifactId> <version>1.2</version> <configuration> <installDirectory>target</installDirectory> </configuration> <executions> <execution> <id>install node and npm</id> <goals> <goal>install-node-and-npm</goal> </goals> <configuration> <nodeVersion>v6.2.1</nodeVersion> <npmVersion>3.9.3</npmVersion> </configuration> </execution> <execution> <id>npm install</id> <goals> <goal>npm</goal> </goals> <configuration> <arguments>install</arguments> </configuration> </execution> <execution> <id>build</id> <goals> <goal>webpack</goal> </goals> </execution> </executions> </plugin> |
剩下的就是配置 webpack了, 指定入口文件和编译器是关键. 这样在 spring-boot:run 的时候, 就会执行 build, 也就是 webpack 的 build, 会将你指定的路径文件, 编译到指定的输出文件中.
文件包结构
其他引用
之后你可以单独在 package.json 文件中定义 npm build 的 script, 以此来添加 eslint 等等检查, 或者其他 task.
如果需要一些源码或者配置详情, 请留言哟~
2020年4月更新回复：
抱歉各位小伙伴， 这个项目已经过去比较久远了，源码已经掉了，当时也没有放github之类的平台。抱歉哈。
其实原理很简单， 就是利用maven那个插件去调用node的命令，进而把前端编译好并且输出到制定目录。
麻烦发一份项目代码想学习下
您好，请问 react 怎么和Spring Boot 后端代码一起部署，能否分享下源码
对不起大家，由于工作更换原因，源码已经掉了。不过也是一个测试项目，按照步骤配置好pom问题应该不大。
有问题随时留言哟。
刚开始弄这个 可以出一份源码么
不好意思啊， 以前的老项目做的，已经没有源码了， 你尝试把pom配好试试呢？ 其实原理就是利用maven的插件去调用node的命令