我在控制台中收到错误“您需要启用 JavaScript 才能运行此应用程序”。反应

Posted 2023-02-22

【中文标题】我在控制台中收到错误“您需要启用 JavaScript 才能运行此应用程序”。反应

【英文标题】：I am getting error in console "You need to enable JavaScript to run this app." reactjs

【发布时间】：2018-10-21 13:15:36

【问题描述】：

我是 reactjs 新手，我正在开发一个应用程序。它运行良好，但是当我运行 npm run build 命令时，出现错误“您需要启用 javascript 才能运行此应用程序。”。即使我给出了“主页”：“./”，我也对 server.js 文件进行了更改，但它并没有解决我的问题。

我通过运行 laravel 项目进行了检查，浏览器中启用了 javascript，还尝试了不同的浏览器。

请有人帮我克服这个错误。

【问题讨论】：

如果你已经构建了应用程序，这意味着构建过程可能剥离了开发服务器。因此，您需要一种运行应用程序的方法，即服务器。

它运行完美，但是当我运行 npm run build 命令时，我开始遇到问题。

是的，构建过程剥离了服务器。所以你无法访问构建，因为它只有 html、css 和 js。您可以在主 html 文件 (developer.mozilla.org/en-US/docs/Web/HTML/Element/script) 中添加一个 js 脚本吗？只需在该 js 脚本文件中添加 'console.log("hello") 即可。走着瞧吧。请确保这个新 js 文件的路径正确。

@kayote 我不清楚你想说什么。请告诉我必须添加哪个文件并使用该 console.log('hello')。如果我使用简单的 执行此操作，它工作正常。

是的，这就是我的意思。因此，您使用 console.log 添加了一个简单的脚本，它起作用了。这意味着 Js 文件正在浏览器中加载，问题很可能是交付。基本上，您需要以某种方式为您的built react 应用程序提供服务。 medium.freecodecamp.org/…

【参考方案1】：

当客户端 package.json 文件中未指定服务器代理时，我收到此消息。

"proxy": "http://localhost:5000"

（其中 5000 应更改为服务器设置为侦听的任何端口号。在我的情况下，添加后还需要重新启动服务器）

【讨论】：

这正是我所需要的。谢谢！

嗨，@MaxWidth 我是怎么知道端口的，因为当我使用这个命令时显示的端口太多了：netstat -nltup

我解决了我的问题！但是我仍然想知道为什么在我使用npm run start 时会发生这种情况，因为如果我使用npm run build 然后服务构建文件夹不会显示此问题。

嗨@Dylan 我正面临相反的问题。它适用于npm run start，但不适用于serve -s build。我的后端在端口 5151 上运行，我在 package.json 中提到了"proxy": "http://localhost:5151"，但它仅在开发人员模式下工作正常，而不是在构建模式下工作......有任何线索吗？

重启服务器对我有帮助！

【参考方案2】：

我有同样的问题。我的可行解决方案：

package.json:

"homepage": "."

index.js：

app.use(express.static(__dirname)); //here is important thing - no static directory, because all static :)

app.get("/*", function(req, res) 
  res.sendFile(path.join(__dirname, "index.html"));
);

【参考方案3】：

我收到此错误是因为我正在进行的 API 调用因 API 密钥无效而被阻止。

【参考方案4】：

尝试在其他浏览器中运行，看看是否正常。

如果它在那里工作，那么请尝试以下方法并刷新您的网站。

右键单击并选择检查。 转到应用程序选项卡。 清除 本地存储、会话存储和 cookie 中的所有内容。 刷新您的网站。

这解决了我的类似问题，希望对其他人有用。

【参考方案5】：

我遇到了同样的问题。就我而言，类名没有遵循模式（必须以大写开头）。一旦我纠正它，一切都开始运作良好。

【参考方案6】：

只要确保这条路线必须出现在所有其他路线之后

app.get("/*", function (req, res) 
   res.sendFile(path.resolve(__dirname, '../client/build', 'index.html'));
)

【讨论】：

这对我有用！我已经尝试了所有其他解决方案，谢谢！

【参考方案7】：

我在同一个 url (localhost:8080) 中设置了一些 cookie，可能来自以前的开发，它以某种方式干扰了我的 React 项目。 我才发现是因为（出于绝望）我尝试使用另一个浏览器并且它有效。 我删除了 cookie，它运行良好。

【参考方案8】：

转到您的 SignIn 组件或 Register 组件，将表单标签更改为 div 标签或阻止表单默认设置，即（e.preventDefault）。还要确保在您的浏览器中启用了 Javascript。

【参考方案9】：

也是一个反应新手，我遇到了这个问题。记得添加 ReactDOM.render(<MyClassName />, document.getElementById("root")); 为我修复了它。

【讨论】：

IT 可能有助于编辑您的答案以说明可能添加的 where

【参考方案10】：

如果您之前没有安装过，请在您的 react 项目文件夹中安装服务；

npm install -g serve

然后使用静态服务器为您的项目提供服务；

serve -s build

build 是 'npm run build' 生成的文件夹。

就是这样！访问

http://localhost:5000

默认情况下。