Реагировать приложение дает 404 на основных JS и CSS

Я построил приложение "Реакция", используя "реактивные скрипты". Приложение отлично работает на моем локальном сервере разработки, но при развертывании на моем реальном сервере приложения, по-видимому, не находят основные компилируемые файлы JS и CSS. Я получаю 404 на обоих.

Ниже приведена информация, которая может помочь. Файлы на сервере расположены по адресу

реклама / сборка / статика /js и реклама / сборка / статика /css || соответственно

404, которые я получаю, находятся на следующих файлах:

https://www.example.com/ads/build/static/css/main.41938fe2.css https://www.example.com/ads/build/static/js/main.74995495.js

Вот как настроен мой сервер:

const express = require('express');
const path = require('path');
const app = express();
const favicon = require('serve-favicon');

//favicon
app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));

app.get('/ads', function (req, res) {
app.use(express.static(path.join(__dirname, 'build/static')));
console.log(path.join(__dirname, 'build'));
res.sendFile(path.join(__dirname, '/build/index.html'));
});

app.listen(9000);

В свой package.json я также включил параметр homepage как: "homepage" : "https://www.example.com/ads

ОБНОВЛЕНИЕ Когда я запускаю приложение на самом сервере по следующему пути: dedicated-server-host:9000/static/js/main.74995495.js который правильно отображает файл JS

Есть ли какая-то конфигурация, которую мне не хватает, маршрутизация не работает. Пожалуйста, порекомендуйте.

Источник

1 ответ

Решение

Используйте отступ, чтобы увидеть ошибку, подобную этой:

app.get('/ads', function (req, res) {
  app.use(express.static(path.join(__dirname, 'build/static')));
  console.log(path.join(__dirname, 'build'));
  res.sendFile(path.join(__dirname, '/build/index.html'));
});

Вы устанавливаете статический маршрут внутри обработчика / ads, добавите новый express.static обработчик маршрута на каждый запрос GET /ads.

Это установит статический маршрут при запуске сервера:

app.use(express.static(path.join(__dirname, 'build/static')));
app.get('/ads', function (req, res) {
  console.log(path.join(__dirname, 'build'));
  res.sendFile(path.join(__dirname, '/build/index.html'));
});

или же:

app.get('/ads', function (req, res) {
  console.log(path.join(__dirname, 'build'));
  res.sendFile(path.join(__dirname, '/build/index.html'));
});
app.use(express.static(path.join(__dirname, 'build/static')));

Но убедитесь, что вы правильно выбрали путь - например, вам может понадобиться:

app.use('/ads/build/static', express.static(path.join(__dirname, 'build/static')));

если вы хотите, чтобы URL в вашем вопросе работал.

Чтобы сделать это намного проще, вы можете использовать только этот один обработчик, чтобы express.static обрабатывал и css/js, и index.html одновременно:

app.use('/ads', express.static(path.join(__dirname, 'build')));

и измените ваш index.html на использование:

вместо:

Иногда получение правильной структуры маршрутов может значительно облегчить работу обработчиков маршрутов.

Источник
Другие вопросы по тегам