java - 使用 Thymeleaf 在 Springboot 中反应空白屏幕
问题描述
我有一个要求,我想使用 Thymeleaf 使用 React 代码。我使用 create-react-app 和 npm start 工作正常。没有添加任何其他代码。这是我的设置 - src\main\resources\templates\index.html
<!DOCTYPE HTML>
<html>
<head>
<title>Getting Started: Serving Web Content</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="/css/main.5f361e03.chunk.css" rel="stylesheet">
<script src="/js/2.b38996be.chunk.js"></script>
<script src="/js/main.8a01ac9e.chunk.js"></script>
</head>
<body>
<div class="root"></div>
</body>
</html>
你可以看到我在上面链接了我的 React 和 CSS 构建代码。
src\main\resources\static 这个位置有css、js、media文件夹
当我访问http://localhost:8080/时,前端是空的。
这是我的 pom 文件。
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.3.0.RELEASE</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
<groupId>com.example.test</groupId>
<artifactId>demo</artifactId>
<version>0.0.1-SNAPSHOT</version>
<name>demo</name>
<description>Demo project for Spring Boot</description>
<properties>
<java.version>1.8</java.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web-services</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
<exclusions>
<exclusion>
<groupId>org.junit.vintage</groupId>
<artifactId>junit-vintage-engine</artifactId>
</exclusion>
</exclusions>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
</plugins>
</build>
</project>
链接到 Github 项目 - https://github.com/kedarnadkarny/springreact
解决方案
我相信您的问题,因为在 index.html 中您忘记加载 /static/main-runtime*.js 该运行时是加载您的 reactjs 应用程序所必需的。
您可以使用这个 maven 插件https://github.com/maasdi/react-assets-maven-plugin来自动化这个过程。
PS:我有类似的问题,我必须创建插件来解决这个问题。
推荐阅读
- java - 嵌套滚动视图上未显示 FAB 按钮
- c# - 如何使用 UIView.hidden 属性来改变视图的可见性
- javascript - 多个 div 指向同一个标签
- reactjs - 在 React Native 中发送 USSD 代码
- regex - 在 Python 3 中遇到正则表达式
- three.js - 对象的属性在场景中不更新
- unity3d - 如何在没有单例的情况下在 Unity3d 中创建游戏范围的对象?
- google-colaboratory - 如何在 Colaboratory Notebook 中使用 control+F 向右移动
- python-3.x - 通过使用 python 脚本和 tor 代理访问网站来增加网站流量
- user-interface - 操作系统可以被视为图形用户界面吗?