Reactjs 加载时是否有办法呈现TSX文件http://localhost:8080/test?

我真的是前端开发的新手。我目前参与了一个做前端开发的项目。我希望我能解释清楚

无论何时调用，它都由

page1.jsp

加载

现在我想加载一个TSX文件而不是JSP。我试图在

web.xml

中将我的

从

page1.jsp

更改为

html/js/page2.tsx

，但我不知道为什么它不起作用。 发生的情况是，将弹出一个下载文件窗口，而不是加载。 我将TSX文件放在

html/js

目录中，因为Typescript和React的包就在那里。顺便说一下，我所说的TSX文件是一个使用Typescript的React组件

是否可以配置web.xml来呈现TSX文件？如果没有，是否有其他方式让我加载它

如果要加载TSX文件，web.xml仍然很重要吗

---

不，有几个原因：

jsp是一个“Java服务器页面”。您可能正在运行一个像Tomcat这样的应用服务器（我已经15年左右没有这样做了，请耐心等待）。它被编译成一个Servlet，然后运行该Servlet生成您的页面作为输出。您的.tsx文件不适合该过程

您的应用服务器可能有一个目录，您可以在其中放置不需要在服务器端运行的静态文件；看看你是否有一个“WebContent”目录。您可以在其中放置纯HTML文件、Javascript文件、固定图像等

但是如果你把你的TSX文件放在那里，你的浏览器仍然不能使用它：浏览器不理解Typescript。Typescript需要编译成Javascript，如果您将生成的.js文件放在那里，那么HTML文件就可以使用它（带有标记），这样就可以了

但您的文件不仅仅是Typescript，它是一个tsx——它可能还包含JSX，它还需要转换为Javascript

还有一些依赖项，比如React，您还需要下载到HTML中

总的来说，这就是像Webpack这样的捆绑包的用途（例如，如果您使用createreact应用程序，您将从一开始就得到一个工作的Webpack配置）。它可以创建一个“bundle.js”，其中包含一个文件中所需的所有Javascript，包括所有依赖项和编译为Javascript的所有TSX代码

---

将它放在WebContent或类似的目录中，从某个HTML文件中的标记调用它——您很可能会在控制台中得到一条很好的错误消息，这将引导您找到我忘记提到的第一件事：-）

否，原因有几个：

jsp是一个“Java服务器页面”。您可能正在运行一个像Tomcat这样的应用服务器（我已经15年左右没有这样做了，请耐心等待）。它被编译成一个Servlet，然后运行该Servlet生成您的页面作为输出。您的.tsx文件不适合该过程

您的应用服务器可能有一个目录，您可以在其中放置不需要在服务器端运行的静态文件；看看你是否有一个“WebContent”目录。您可以在其中放置纯HTML文件、Javascript文件、固定图像等

但是如果你把你的TSX文件放在那里，你的浏览器仍然不能使用它：浏览器不理解Typescript。Typescript需要编译成Javascript，如果您将生成的.js文件放在那里，那么HTML文件就可以使用它（带有标记），这样就可以了

但您的文件不仅仅是Typescript，它是一个tsx——它可能还包含JSX，它还需要转换为Javascript

还有一些依赖项，比如React，您还需要下载到HTML中

总的来说，这就是像Webpack这样的捆绑包的用途（例如，如果您使用createreact应用程序，您将从一开始就得到一个工作的Webpack配置）。它可以创建一个“bundle.js”，其中包含一个文件中所需的所有Javascript，包括所有依赖项和编译为Javascript的所有TSX代码

---

将它放在WebContent或类似的目录中，从某个HTML文件中的标记调用它——您很可能会在控制台中得到一条很好的错误消息，这将引导您找到我忘记提到的第一件事：-）

浏览器只读取文件类型HTML、css和js（JavaScript）。其他一切都需要“传输”。否则，浏览器只是下载它，以便用户可以在读取该文件类型的程序中打开它：）浏览器只读取文件类型html、css和js（JavaScript）。其他一切都需要“传输”。否则，浏览器只是下载它，以便用户可以在读取该文件类型的程序中打开它：）