Question

我已经创建了一个可正常运行的React + Django REST项目，并且在我的开发机器上运行正常。我已使用以下方法使其在我的CentOS 7服务器上工作。

我使用npm run build创建了构建目录，并将其复制到Django项目的根文件夹。
我在Django设置的TEMPLATES列表中添加了build目录，以标识index.html文件。
我在build/static中添加了STATICFILES_DIRS文件夹。
我在根url(r'^.*', TemplateView.as_view(template_name='index.html')),文件中添加了URLS行，以捕获所有url模式并将索引文件加载到包含React应用程序的build文件夹中。
我运行manage.py collectstatic创建一个包含所有静态文件的staticfiles文件夹。
我将staticfiles文件夹添加到Nginx conf文件中，如下所示：

location /static/ { root /home/michel/project/staticfiles; }
我已经重新启动了nginx服务器。

我正在使用Django服务器加载index.html文件，并且我期望staticfiles文件夹将包含加载我的React应用程序所需的静态文件。

但是，当我访问www.mydomain.com时，它会加载index.html文件，但不会在<div id='root'></div>上加载React应用。我知道这一点是因为显示了索引的页脚，但是样式化该页脚的css也无法正常工作。

我猜我在检测静态文件方面存在问题。有解决办法吗？

编辑这是将我的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

为什么我的React-Django应用程序无法检测到静态文件？

1 个答案: