Почему мое приложение React-Django не обнаруживает статические файлы?

Question

Я создал рабочий проект React + Django REST, и он отлично работает на моей машине для разработки. Я использовал следующий метод, чтобы он работал на моем сервере CentOS 7.

1. Я создал каталог сборки с помощью npm run build и скопировал его в корневую папку проекта Django.

2. Я добавил каталог build в список ШАБЛОНОВ в настройках Django, чтобы идентифицировать файл index.html.

3. Я добавил build/static папку в STATICFILES_DIRS.

4. Я добавил url(r'^.*', TemplateView.as_view(template_name='index.html')), строку в корневой файл URLS, чтобы захватить все шаблоны URL и загрузить индексный файл в папку сборки, которая содержит приложение React.

5. Я запускаю manage.py collectstatic, чтобы создать папку staticfiles со всеми статическими файлами.

6. Я добавил папку staticfiles в файл конфигурации Nginx, как показано ниже:

   location /static/ { root /home/michel/project/staticfiles; }

7. Я перезапустил сервер nginx.

Я использую сервер Django для загрузки файла index.html и ожидаю, что папка staticfiles будет содержать необходимые статические файлы для загрузки моего приложения React.

Однако, когда я захожу на www.mydomain.com, он загружает файл index.html, но НЕ загружает приложение React на <div id='root'></div>. Я знаю это, потому что показан нижний колонтитул индекса, но CSS для стилизации этого нижнего колонтитула также не работает.

Я предполагаю, что у меня проблема с обнаружением статических файлов. Любое решение?

EDIT Вот код, который связывает мое приложение React с файлом index.html.

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';

ReactDOM.render(<App />, document.getElementById('root'));
registerServiceWorker();

P.S. Он автоматически генерируется командой create-react-app.

Answer 1

Вероятно, потому, что вы не понимаете директиву Nginx root.

Это:

location /static/ {
    root /home/michel/project/staticfiles;
}

Означает, что если я запрашиваю www.yourwebsite.com/static/style.css, то Nginx будет ожидать, что местоположение файла будет

/home/michel/project/staticfiles/static/style.css не

/home/michel/project/staticfiles/style.css