为什么当我在Apache上运行我的react build ...只是出现空白页..?

时间:2018-09-17 13:35:14

标签: reactjs apache

应用程序在节点服务器上运行正常,但即使使用绝对路径,我在Apache服务器上也获得空白页。

这是index.html代码

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
  <meta name="theme-color" content="#000000">
  <link rel="manifest" href="/manifest.json">
  <link rel="shortcut icon" href="/favicon.ico">
  <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
  <title>React App</title>
  <link href="./static/css/main.0778317d.css" rel="stylesheet">
</head>

<body>
  <noscript>You need to enable JavaScript to run this app.</noscript>
  <div id="root"></div>
  <script type="text/javascript" src="./static/js/main.1b4d826e.js"></script>
</body>

这是屏幕截图。 enter image description here

enter image description here

2 个答案:

答案 0 :(得分:2)

我正在使用反应路由器4 。因此,当我使用 Router 时,它会产生问题,并且无法使用绝对路径。而不是使用 BrowserRouter Router ,并使用 basename 来存储我在其中复制项目构建的文件夹。

从“ react-router-dom”导入{BrowserRouter,Route,Switch};

<BrowserRouter history={history} basename="/shop/">
      <div>
        <Switch>
          <Route exact path="/" component={App} />
          <Route path="/cart" component={Cart} />
          <PublicRoute path="/login" component={LoginPage} />
          <PrivateRoute path="/dashboard" component={DashBoardPage} />
          <PrivateRoute path="/checkout" component={checkOut} />
          <PrivateRoute path="/favourite" component={favourite} />
          <PrivateRoute
            path="/payment_Information"
            component={PaymentInformation}
          />
          <Route path="/product_details/:pid" component={ProductDeatils} />
          <Route path="*" compononent="NotFound" />
        </Switch>
      </div>
    </BrowserRouter>

并在 package.json 文件“主页”:“ / shop” 中创建路径。

答案 1 :(得分:1)

即使尝试了@Abdul Moiz提到的步骤,我也无法使用React Router v4来使我的应用程序可以在Apache主机上运行。

我找到了这个答案:https://stackoverflow.com/a/50657757/7867822

基本上将<BrowserRouter/>更改为<HashRouter/>对我有用。