Javascript Heroku应用程序仅适用于Chrome桌面//React.Js应用程序

最近完成了一个React项目，该项目获取新闻文章并显示它们。最近部署到Heroku，发现只有桌面上的Chrome才运行它

当我在Javascript控制台中查看时，Safari和Firefox都会给出相同的错误

链接到heroku应用程序-

服务器设置

    const express = require("express");
const mongoose = require("mongoose");
const bodyParser = require("body-parser");
const passport = require("passport");
const path = require("path");

const users = require("./routes/api/users");
const profile = require("./routes/api/profile");

const app = express();
// Body Parser Middleware
app.use(express.urlencoded({ extended: false }));
app.use(express.json());

// DB config
const db = require("./config/keys").mongoURI; //mongodb database url connection

// connect to mongodb
mongoose
  .connect(db)
  .then(() => console.log("MongoDB Connected"))
  .catch(err => console.log(err));

//passport Middleware

app.use(passport.initialize());

//passport config
require("./config/passport")(passport);

//use routes

app.use("/api/users", users);
app.use("/api/profile", profile);

// Server static assets if in production
if (process.env.NODE_ENV === "production") {
  // Set static folder
  app.use(express.static("client/build"));

  app.get("*", (req, res) => {
    res.sendFile(path.resolve(__dirname, "client", "build", "index.html"));
  });
}

const port = process.env.PORT || 5000;

app.listen(port, () => console.log(`Server running on port ${port}`));

---

我不认为我的代码有任何问题，因为它在本地运行得很好，chrome处理得很好。Safari、Firefox和手机上的任何浏览器都无法呈现我的web应用程序的任何部分，有什么明显的原因吗？

也有同样的问题。在部署之前，请确保取出redux开发工具

在store.js文件中包括以下内容，以避免在生产中使用“redux devtools”

if(process.env.NODE_ENV === 'production') {
    store = createStore(rootReducer, initialState, compose(
        applyMiddleware(...middleware)
    ));
} else {
    store = createStore(rootReducer, initialState, compose(
        applyMiddleware(...middleware),
        window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
    ));
}

---

这个想法是在开发过程中只包括REDUX_开发工具。在生产中不应使用此选项，因为只有具有redux devtool扩展的浏览器才能查看页面。

此问题是由于redux devtools扩展而出现的

您很可能在未安装redux devtools扩展的所有浏览器控制台中出现以下错误：

TypeError:undefined不是对象（正在计算“b.apply”）

这是因为

window.\uuuu REDUX\u DEVTOOLS\u EXTENSION\uuuu&&window.\uuuu REDUX\u DEVTOOLS\u EXTENSION\uuu（）

您最有可能实现的是返回undefined，这意味着在undefined上调用.apply（），从而导致错误

您可以将其完全从产品中删除，就像他在真正伟大的回答中提到的@Vindao一样，或者使用以下代码，如果当前浏览器不支持，这些代码将不会使用redux devtools扩展：

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose; 
const store = createStore(rootReducer, initialState, composeEnhancers(
    applyMiddleware(...middleware)
  ));

---

有关如何使用Redux devtools扩展创建商店的更多详细信息或其他可能性，请参见

uhmm，您已经启用了sourcemaps，因此我可以查看您的所有前端代码：@DakshMiglani有什么原因不能在Safari、Firefox或移动浏览器上呈现吗？我想它找不到reducer函数，在这个代码片段中没有给出任何东西来理解这个问题。您应该对此进行扩展，以获得真正伟大的答案。为什么会出现这种情况？我以前也遇到过这种情况。你赢了我！我认为Chrome也不会在没有Redux开发工具作为扩展的情况下运行它。我认为它搞乱了Redux中间件。