ReactJS 链接到来自不同文件夹/项目的本地 HTML 文件

问题描述

我正在使用 ReactJS 构建一个站点,我想创建一个指向本地 HTML 文件的链接(a href="relativepath"),以便当用户单击该链接时,它会打开 html页。本地文件位于项目外的不同文件夹 X 中,我不想将其上传到我的 src 文件夹中,因为 html 文件依赖于 X 中的许多其他文件。有没有什么好的方法可以这样做?

我还想上传一个不同的本地 HTML 文件,该文件已经在我的 React 应用程序的 src 文件夹中。我目前有这样的事情: import htmlFile from "../links/htmlFile.html"; export default function Something(props) { return (<a href={htmlFile}></a>)} 它在我的终端中说

您可能需要一个合适的加载器来处理此文件类型,目前没有配置加载器来处理此文件。见https://webpack.js.org/concepts#loaders > <html>| | <head> >

我已经尝试添加 webpack + 一个 htmlLoader,但我认为我错误地遵循了这些步骤,因为我无法让它工作。我卸载了这些包,所以我现在回到了第一个。 非常感谢!

解决方法

仅链接到其他位置的本地文件或从其他位置的本地文件导入将不起作用,除非这些本地文件也部署到与应用程序相关的同一位置的服务器(并且网络服务器可以访问该位置)。

因此,您需要将文件及其链接的依赖项复制到一个文件夹中,该文件夹将与您的 React 构建一起部署,但不会将其视为 React 代码库的一部分,因此 webpack 将尝试编译它(所以也不在 src 中)。

例如,如果您使用 create-react-app 来设置您的应用程序,这将是 the public folder;其他 webpack 设置可能使用不同的名称,但一般概念是相同的。

相关问答

错误1:Request method ‘DELETE‘ not supported 错误还原:...
错误1:启动docker镜像时报错:Error response from daemon:...
错误1:private field ‘xxx‘ is never assigned 按Alt...
报错如下,通过源不能下载,最后警告pip需升级版本 Requirem...