#reactjs #heroku #react-router
#reactjs #heroku #react-router
Вопрос:
Я загрузил свое приложение на heroku. Я хотел example.herokuapp.com/someRoute
бы работать так же, как localhost:3000/someRoute
(он работает локально, но не когда я загружаю его на heroku) что я должен сделать, чтобы заставить его работать? Я попытался добавить статический файл.json с этой конфигурацией
{
"root": "build/",
"routes": {
"/**": "index.html"
}
}
но это ничего не изменило: ( Есть предложения, как это исправить?
Ответ №1:
Возможно, у вас ошибка, из-за которой вы отправляете индексный файл, например, с помощью res.sendFile из папки / client / public . Вместо этого в производственной среде вы должны были обслуживать его из / client / build
Пожалуйста, передайте файл из сборки в производство и общедоступный при разработке.
Пример таков:
if (process.env.NODE_ENV === "production") {
app.use(express.static("client/build"));
app.get("/*", function(req, res) {
res.sendFile(path.join(__dirname, "./client/build/index.html"));
});
}
else {
app.use(express.static(path.join(__dirname, '/client/public')));
app.get("/*", function(req, res) {
res.sendFile(path.join(__dirname, "./client/public/index.html"));
});
}
Комментарии:
1. я думаю, проблема в том, что я вообще не добавлял res.sendFile … я не уверен, как мне его добавить, поскольку я использую контроллер …. это мой код « app.use(express.static(path.join(__dirname, ‘client / build’))); app.use(bodyParser.urlencoded({extended: true})); app.use(bodyParser.json()); app.use(‘/’, MainController); app.listen({port}, () => {console.log(
app is on port: ${port}
); }); process.on(‘uncaughtException’, (ошибка, происхождение) => {console.log(ошибка); }) «2. и имеет ли значение, использую ли я общедоступную папку или папку сборки?
3. Да, это важно. Папка сборки — это папка, которая используется heroku во время производства, и это также стандартная практика для этого!
4. моя проблема в том, что я вообще не загружал клиентскую папку на github, и теперь я не могу ее добавить, поэтому мне придется создавать новое приложение? кстати, с кодом все в порядке?
5. Если вы сделаете это так, как я упоминал, это обязательно сработает!