Вложенные маршруты с ExpressJS и реакции-маршрутизатором - PullRequest
0 голосов
/ 25 июня 2019

Я хочу использовать вложенные маршруты с ExpressJS и реагировать на маршрутизатор, но я сталкиваюсь с проблемами, связанными с тем, что вложенный маршрут меняет путь, что приводит к 404.

У меня есть внутренний сервер NodeJS с ExpressJS, работающим на порту5000. Сервер Express настроен для обработки API-запросов (localhost:5000/api/something) и статического содержимого для всех других GET-запросов.

server.js

// Serve static files from the React frontend app
app.use(express.static("dist"));

app.get('/*', function(req, res) {
  res.sendFile("index.html", { root: path.join(__dirname, '../../../dist') });
});

// Choose the port and start the server
const PORT = process.env.PORT || 5000;
app.listen(PORT, () => {
  console.log(`Node server started on port: ${PORT}`);
});

app.js

import React, { Component } from "react";
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
import Start from "./pages/Start";
import Page from "./pages/Page";
import Subpage from "./pages/Subpage";


class App extends Component {
  render() {
    return (
      <div>
        <Router>
          <Switch>
            <Route path="/page" component={Page} />
            <Route path="/page/:subpage" component={Subpage} />
            <Route exact path="/" component={Start} />
          </Switch>
        </Router>
      </div>
    );
  }
}

export default App;

Проблема с этой настройкой заключается в том, что при попытке загрузить localhost: 5000 / page / subpage я получаю сообщение об ошибке ниже:

Uncaught SyntaxError: Unexpected token <

Я думаю, это связано с тем, что server.js добавляет page к пути, в котором хранятся файл bundle.js и index.html.

Чего я хочу достичьэто просто позволить app.js обработать запрос и загрузить соответствующий компонент.

Если что-то неясно, пожалуйста, дайте мне знать.

Заранее спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...