Javascript 梅恩&；Heroku：我的应用程序显示在VirtualBox/Linux环境中，但不显示在Windows或mobile上

更新 在windows浏览器的控制台上（应用程序未加载，仅加载背景图像），我有一个错误：

Uncaught TypeError: Cannot read property 'apply' of undefined

这个错误并没有出现在Ubuntu内部的浏览器上，它实际上是在运行的。我正在调查此事

---

我正在使用Oracle VM VirtualBox和Debian Ubuntu操作系统开发这个MERN应用程序。我把它推给了希罗库。 日志中没有任何错误MSG，网站在virtualbox中可以正常打开

但在我的windows浏览器上，它只显示背景图像（略微失真），当我尝试在手机上访问它时，它也会显示背景图像

到目前为止，我有很多错误，最初我的应用程序在技术上是“正常工作”的，但是

无法在屏幕上获取/

错误，我发现该错误实际上正在工作，但只是显示了我应用程序的后端部分（我通过转到我在Express中设置的URL进行测试，我的数据就在那里）

所以我安装了

cors

和

path

（在另一篇stackoverflow帖子后面）并配置了

server.js

，现在它可以正常工作了。但我不确定问题出在哪里

该应用程序的结构是，在根目录中，我有我需要的任何后端内容（server.js文件、路由、模型、模块等），包括一个目录/客户端，这是React前端应用程序所在的位置

我的server.js文件

const mongoose = require('mongoose');
const express = require('express');
const app = express();
const config = require('config');
const cors = require('cors');
const path = require('path');

// Middleware
app.use(express.json());

// DB Config
// You can get all your config/ values with config.get('')
const db = config.get('mongoURI');

// Connect to MongoDB
mongoose
    .connect(process.env.URI || db, { 
        useNewUrlParser: true,
        useUnifiedTopology: true,
        useCreateIndex: true
    })
    .then(() => console.log("Connected to MongoDB.."))
    .catch(err => console.log(err));

// Available Routes
const tournaments = require('./routes/api/tournaments');
const users = require('./routes/api/users');
// Use Routes
app.use(cors());
app.use('/tournaments', tournaments);
app.use('/users', users);

// For Heroku deployment
if(process.env.NODE_ENV === 'production') {
    app.use(express.static(path.join(__dirname, 'client', 'build')));
    app.get('*', (req, res) => {
        res.sendFile(path.join(__dirname, 'client', 'build', 'index.html'))
    });
};

// Run Server
const port = process.env.PORT || 5000;
app.listen(port, () => console.log(`Server started on port: ${port}`));

mypackage.json

{
  "name": "smash-hosting",
  "version": "1.0.0",
  "description": "",
  "engines": {
    "node": "12.16.2"
  },
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "client-install": "cd client && npm install",
    "start": "node server.js",
    "server": "nodemon server.js",
    "client": "cd client && npm start",
    "dev": "concurrently \"npm run server\" \"npm run client\"",
    "heroku-postbuild": "cd client && npm install && npm run build"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "bcryptjs": "^2.4.3",
    "concurrently": "^5.0.0",
    "config": "^3.2.4",
    "cors": "^2.8.5",
    "express": "^4.17.1",
    "jsonwebtoken": "^8.5.1",
    "moment": "^2.26.0",
    "mongoose": "^5.7.12",
    "nodemon": "^1.19.4",
    "path": "^0.12.7",
    "react-icons": "^3.10.0",
    "react-tournament-bracket": "^0.2.4"
  },
  "devDependencies": {
    "nodemon": "^1.19.4"
  }
}

---

服务器似乎正在运行，但无法让客户端连接。Bash命令

&&

（和）在windows中不起作用。替换为单个

&

操作员。

解决了问题

问题显然与Redux有关。我注意到在浏览器中我的应用程序未正确渲染的地方，控制台中有一个错误：

未捕获类型错误：无法读取未定义的属性“apply”

这让我想到了一个有多种解决方案的解决方案

最终，从REDUX商店中删除REDUX_扩展工具代码可以让我的heroku应用程序在包括我的手机在内的不同浏览器上正确呈现

store.js文件：

import { createStore, applyMiddleware, compose } from 'redux';
import thunk from 'redux-thunk';
import rootReducer from './reducers';
const initialState = {};
const middleware = [thunk];
const store = createStore(
    rootReducer,
    initialState,
    compose(
        applyMiddleware(...middleware)
        // window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
    )
);
export default store;

---

谢谢你的提示。这似乎打破了它（404错误）。如果&&真的是个问题，我将在脚本中使用

--前缀client