Реагировать на пустую страницу после развертывания в папке

Question

У меня есть приложение реакции: http://we****.com/buzz/

Приведенный выше URL-адрес показывает, что оно было развернуто в папке buzz.

В браузере только displays blank page и no console error.

Я уже установил переменную homepage в файле package.json, и все URL-адреса в порядке.

Может кто-нибудь сообщить мне об этой проблеме.

Мой пакетФайл .json:

{
  "name": "buzz",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-router-dom": "^5.0.1",
    "react-scripts": "3.0.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "homepage": "http://we****.com/buzz/",
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Мой файл маршрута ::

import React, { Component } from 'react';
import { BrowserRouter, Route, Switch } from "react-router-dom";

import HomeComponent from '../Components/Home';
import LoginComponent from '../Components/Login';
import SignupComponent from '../Components/Signup';
import MyStoriesComponent from '../Components/Story/MyStories';
import AddStoryComponent from '../Components/Story/AddStory';

export default class Routes extends Component {
    render() {
        return (
            <BrowserRouter>
                <Switch>
                    <Route exact path="/" component={HomeComponent} />
                    <Route exact path="/login" component={LoginComponent} />
                    <Route exact path="/signup" component={SignupComponent} />
                    <Route exact path="/mystories" component={MyStoriesComponent} />
                    <Route exact path="/addstory" component={AddStoryComponent} />
                    {/*<Route exact path="/listPartnerAccount/:id" component={ListPartnerAccount} />*/}
                </Switch>
            </BrowserRouter>
        );
    }
}

Answer 1

это должно работать нормально, если вы загружаете свои файлы сборки в этот каталог (http://*****.com/buzz/).

Пожалуйста, сначала убедитесь, что после добавления домашней страницы на package.json вы создаете свое приложение. Команда (yarn run build ORсборка), после этого загрузите файлы из директории сборки в желаемое место.

Answer 2

Я решил проблему, выполнив 2 действия:

1) Установите следующий код в файле package.json

"homepage": "http://we****.com/buzz/" 

2) Задайте базовое имя в BrowserRouter в файле маршрута:

export default class Routes extends Component {
    render() {
        return (
            <BrowserRouter basename={'/buzz'}>
                <Switch>
                    <Route exact path="/" component={HomeComponent} />
                    <Route exact path="/login" component={LoginComponent} />
                    <Route exact path="/signup" component={SignupComponent} />
                    <Route exact path="/mystories" component={MyStoriesComponent} />
                    <Route exact path="/addstory" component={AddStoryComponent} />
                    {/*<Route exact path="/listPartnerAccount/:id" component={ListPartnerAccount} />*/}
                </Switch>
            </BrowserRouter>
        );
    }
}

Обратите внимание, что только установка домашней страницы в файле package.json у меня не сработала, мне помогло сочетание двух вышеперечисленных шагов.