免装 Node.js 也能跑前端:boot-react Gradle 多模块构建与双栈环境搭建详解

📅 2026/8/22 14:55:47
免装 Node.js 也能跑前端:boot-react Gradle 多模块构建与双栈环境搭建详解
免装 Node.js 也能跑前端boot-react Gradle 多模块构建与双栈环境搭建详解【免费下载链接】boot-reactA starter application with spring boot and react项目地址: https://gitcode.com/gh_mirrors/bo/boot-reactboot-react 是一个 Spring Boot React 双栈启动器项目。它的亮点是你不需要本机安装 Node.js只需 Java 和 Gradle 就能自动下载 Node 环境、构建 React 前端并把前后端打进同一个 JAR。本文带你完整搭建这套双栈开发环境。为什么可以免装 Node.js传统做法是全局安装 Node.js 和 Yarn再手动执行构建命令。boot-react 换了一种思路前端模块使用com.moowork.node这个 Gradle 插件并在配置里声明download true。首次构建时Gradle 会自动下载指定的 Node.js 版本本项目锁定 6.10.3和 Yarn全程不依赖本机环境。配置就写在 frontend/build.gradle 的node块里一目了然node { version 6.10.3 download true }这样做的好处团队里每个人、CI 机器上用的 Node 版本完全一致彻底告别在我电脑上能跑的版本地狱。Gradle 多模块结构前端后端如何分工打开 settings.gradle 只有两行核心内容——它声明了两个子模块include frontend include backend模块职责关键文件frontendReact Redux 前端Webpack 打包frontend/build.gradlebackendSpring Boot 后端含 Spring Security 与 Sessionbackend/build.gradle前端模块里还注册了三个常用 Gradle 任务见 frontend/build.gradlebundle生产环境打包输出到frontend/diststart启动热更新开发服务器test运行 Mocha 组件测试也就是说以前要敲的yarn install、yarn run bundle现在都变成了./gradlew frontend:xxx。一键启动双栈开发环境第一步获取项目git clone https://gitcode.com/gh_mirrors/bo/boot-react cd boot-react第二步启动后端前端会自动拉起./gradlew bootRun背后的机制在 YarnRunner.java 里它是一个 Spring Boot 的CommandLineRunner在后端启动时自动定位frontend/package.json用yarn check检查依赖是否最新缺了就执行yarn install启动前端热更新服务器而且它只在非 production、非 test环境下生效YarnRunner.java#L34-L42Windows 下会自动换成cmd /c方式执行命令跨平台友好。第三步打开浏览器访问启动后访问http://localhost:8080即可。修改 JavaScript 或 Stylus 文件会热更新无需刷新页面修改 Java 代码则通过 Spring DevTools 自动重启类加载器。 更推荐的方式用 IDEA / Eclipse 直接运行 BootReactApplication 的主方法体验同样流畅。生产打包前端资源如何住进JAR这是多模块构建最精彩的部分。查看 backend/build.gradle两个配置完成了前后端合并jar任务会把../frontend/dist整个目录复制进 JAR 的static文件夹jar.dependsOn(:frontend:assemble)保证打 JAR 前先完成前端打包所以一条命令就能产出完整可部署的包./gradlew clean assemble产物位于backend/build/libs/boot-react-0.0.1-SNAPSHOT.jar启动命令java -jar backend/build/libs/boot-react-0.0.1-SNAPSHOT.jar --spring.profiles.activeproduction一个 JAR 后端 API 打包好的前端静态资源部署极其简单。✅Docker 部署连服务器都不用装 Node如果连 Java 都不想装项目还内置了 Docker 构建任务backend/build.gradle#L64-L74./gradlew backend:buildDocker docker run -p 8080:8080 boot-react/boot-react项目根目录的 docker-compose.yml 更进一步一键拉起应用 Redis 两个容器docker-compose up -d注意生产环境建议启用redis配置档案让 Spring Session 把会话存入真实 Redis开发环境默认用内存 Map 存储见 EmbeddedSessionConfig.java。测试双栈全覆盖./gradlew check这一条命令同时运行前后端全部测试后端Spock 框架编写示例见 AuthenticationResourceSpec.groovy前端Mocha Enzyme 组件测试见 frontend/test/常见问题速查 ❓问题解答本机真的什么都不用装只需 Java 8。Gradle 通过 gradlew 包装器版本 2.6自动就绪Node 由插件自动下载想用真实 Redis以redis配置档案启动并在application.yml中配置连接只改前端如何快速构建./gradlew frontend:bundle单独触发前端模块路由在刷新页面后 404项目用 SinglePageAppConfig.java 的静态资源处理器将所有非资源请求重定向到 index.html更多细节可查阅项目自带的 README.adoc。总结boot-react 用 Gradle 多模块把前后端分属两套工具链的烦恼收敛成一套命令——开发时bootRun一键双栈热更新交付时assemble一键合并打包全程免装 Node.js。对于想快速体验 Spring Boot React 组合的新手这是非常干净的起点。【免费下载链接】boot-reactA starter application with spring boot and react项目地址: https://gitcode.com/gh_mirrors/bo/boot-react创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考