Маршруты React с двумя параметрами не работают при сборке React - PullRequest
0 голосов
/ 01 августа 2020

Я использую реагирующий маршрутизатор, и все работает нормально в разработке, но производственная сборка реагирующего приложения не работает, когда я посещаю некоторые маршруты с более чем одним параметром, например http://localhost: 3000 / me / edit.

Я пробовал развернуть netlify с файлом _redirects, также с nginx и также с serve. Ни один из трех вариантов не сработал.

Кажется, запрашивается файл в папке stati c. Я прикреплю два изображения, чтобы вы могли видеть, о чем я говорю.

Это то, что я вижу на вкладке «Источники»:

Когда я посещаю http://localhost: 3000 / меня, это работает хорошо, и вот что я вижу на chrome:

When I visit http://localhost:3000/me/edit if leads to a blank page, and it seems to be requesting a file inside me > static > edit which obviously does not exist; and this is what I can see on chrome:

1 Ответ

0 голосов
/ 01 августа 2020

Итак, я наконец смог это решить, проблема заключалась в том, что маршруты с более чем одним параметром stati c или Dynami c (например: /me/edit или /user/:id) искали файл внутри папки , в данном случае me или user, которых не существует. Вот как я это решил:

Я создал папку под названием «production» внутри этой папки. Я запустил npm init, я вставил всю папку build, созданную с помощью response. Затем я создал файл с именем server.js (это точка входа, которую я указал). Этот файл содержит следующее:

const express = require('express')
const path = require('path');
const cors = require('cors')

// Initializing express
const app = express()

// Initializing middleware to indicate express where to serve the static files from:
app.use(express.static(path.join(__dirname, 'build')));

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

app.use(cors())


const PORT = process.env.PORT || 4000
app.listen(PORT, () => console.log(`Server listening on port ${PORT} ?`))

Кроме того, я добавил это: <base href="/"> в свой index. html файл внутри папки сборки.

В пакете. json Я добавил стартовый скрипт "start": "node server.js" и все, никогда не набирал npm начало так удовлетворительно ?

Теперь весь проект выглядит так:

введите описание изображения здесь

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