反应公用文件夹脚本答案

【问题标题】：React public folder scripts反应公用文件夹脚本
【发布时间】：2020-07-17 06:57:32
【问题描述】：

请来反应专家哈哈。我正在尝试将一些外部 javascript 文件导入/包含到我的 React 项目中，这些 js 文件无法按照我公司的指示进行更改或编辑，因为这是许多使用它们的应用程序的基础。

出于某些原因，我不会放置真实的文件名和文件夹。 我的公用文件夹中有一个名为“testModules”的文件夹，所以路径是 public/testModules/ 我需要包含的所有文件 / 3 个文件都在其中。

到目前为止我已经尝试过什么。

在底部的 index.html 文件中，我尝试了以下操作

<script type="text/JavaScript" src="%PUBLIC_URL%/testModules/test1.js"></script>
<script type="text/JavaScript" src="%PUBLIC_URL%/testModules/test2.js"></script>
<script type="text/JavaScript" src="%PUBLIC_URL%/testModules/test3.js"></script>

和

<script type="text/JavaScript" src="./testModules/test1.js"></script>
<script type="text/JavaScript" src="./testModules/test2.js"></script>
<script type="text/JavaScript" src="./testModules/test3.js"></script>

和

<script type="application/javascript" src="./testModules/test1.js"></script>
<script type="application/javascript" src="./testModules/test2.js"></script>
<script type="application/javascript" src="./testModules/test3.js"></script>

和

然后我也尝试使用ScriptTag插件“react-script-tag”

使用与上述相同的示例，但我使用 process.env.PUBLIC_URL 而不是 %PUBLIC_URL%

当我尝试上述任何方法时，它适用于我的本地开发环境。例如运行 npm run start 并在 localhost 上打开

但是，一旦我将应用程序转移到实时服务器，我就会收到以下错误

拒绝执行来自“https://test.com/testModules/test.js”的脚本因为它的 MIME 类型 ('text/html') 是不可执行的，并且严格的 MIME 类型检查已启用。

对于我添加的所有文件。

现在我打开我的开发控制台，我可以看到脚本被附加/包含在底部的正文中。

发生了什么，我该如何解决。

谢谢你

【问题讨论】：

那么你有什么样的网络服务器？
我不确定，因为这部分是由我们的一位后端开发人员运行的。我可以告诉你这个过程，它被推送到 git swarm，然后用 docker 构建和部署，然后使用 Traefik 作为我理解的反向代理。希望这可能会有所帮助
一切都已构建，应用程序正在“工作”，它只是阻止它的脚本问题。如果你明白我想说的话。
好吧，看起来可能是服务器设置

标签： javascript html

【解决方案1】：

如果您不想对部署架构进行任何改进，那么您应该与“您的后端开发人员”进行交流，以便他们配置 Web 服务器，以便此特定路由在服务时发出不同的 MIME 类型这个特定的静态文件。

或者，如果可能，您可以使用 Webpack 将第三方代码库静态链接到您的 React 项目，以便将它们分布在一起。这样，如果您使用任何 Javascript 模块的实现，您将消除在 HTML 主机范围内可见的库的这种拐杖，这可能会改进您的代码库。

【讨论】：