Create-React-App在WHM / cPanel服務器上顯示空白頁

Question

我正在嘗試將React應用程序部署到生產環境中，看來我遇到了一個我無法解決的問題，到目前為止，我無法研究任何在線答案。

我創建了一個具有簡單登錄/注冊系統的應用程序，並使用redux + saga做到了。

運行后：

npm run-script build

我收到一條消息，例如已准備好將構建文件夾部署（到目前為止一切正常）。 將文件上傳到cPanel中的“ public_html”文件夾后，我得到一個空白頁面，其中有React App作為標題和圖標加載。

到目前為止，我已嘗試解決此問題：

1. 將首頁設置為“。” 在package.json中（不走運，檢查“網絡”選項卡顯示所有文件的狀態均為200，確定）
2. 更新到我的依賴項的最新版本
3. 安裝節點並嘗試“提供”構建服務（我真的不理解這一部分）

另外，我在控制台中有一個錯誤（可能與Web應用程序完全無關，因為我在配置中有redux開發工具，因此未顯示任何內容）：

控制台日志錯誤：

我非常渴望找到解決方案。 感謝您的貢獻和時間。

store.js：

import { createBrowserHistory } from 'history';
import { applyMiddleware, compose, createStore } from 'redux';
import { routerMiddleware } from 'connected-react-router'
import createSagaMiddleware from 'redux-saga';

import rootReducer from './index';
import rootSaga from './sagas';

const defaultState = {};

export const history = createBrowserHistory()

const sagaMiddleware = createSagaMiddleware()

const store = createStore(
  rootReducer(history),
  defaultState,
  compose(
    applyMiddleware(
      routerMiddleware(history),
      sagaMiddleware
    ),
    window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
  )
);

sagaMiddleware.run(rootSaga);

export default store;

Answer 1

問題在於撰寫功能。 對於開發而言，它將起作用，但對於生產模式，則需要刪除devtools。

嘗試使用不同的撰寫方法進行開發和生產。 下面給出了示例代碼段。

const devTools = process.env.NODE_ENV === 'development' ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__() : null

const store = createStore(
  rootReducer,
  compose(applyMiddleware(thunk), devTools)
)

您也可以嘗試使用庫“ redux-devtools-extension ”進行編寫。