Django + React生产设置

问题描述 投票:0回答:1

这似乎是一个非常基本的问题,我对找不到任何明智的教程感到困惑。我正在尝试设置Django + React生产版本。运行各种编译,缩小等之后。我最终得到了.js.css包,index.html和其他几个文件,例如favicon,service-worker.js等。现在,我需要在Django中使用它。

所有这些文件都是静态文件,可能应该由http服务器(在我的情况下为nginx)用作静态文件。我想出的变体是修改index.html以使其成为有效的Django模板:{% load static %}首先,将所有硬编码链接替换为{% static 'filepath' %}并使用TemplateView进行提供,其他文件由[C0提供] ]。这很好,但是,修改构建结果似乎是个坏主意。生成的包为每个构建包含一个唯一的哈希,我将需要在每个构建之后在模板中替换该哈希。我显然可以自动化,但是看起来很奇怪。我不希望完全不涉及构建结果,但是那我应该如何提供静态文件呢? nginx配置为在nginx路径下提供静态文件,而不能将/static/之类的文件作为静态文件提供。

所以问题是如何配置Django + React进行生产,这样我就不必手动修改构建结果并可以使用nginx正确提供静态文件?

django reactjs nginx static-files
1个回答
0
投票
但是,如果您希望django渲染模板以避免使用单页应用程序(如react提供的那样),并且您要使用django的所有其他工具,那么我们公司使用的主要流程是:

1)您可以在js文件中创建组件。例如:service-worker.js

2)您使用babel将JSX文件编译为本机Javascript,并且小贝创建例如component.js。 Django将提供编译后的文件,因此react将仅在开发任务中使用,因为所有的React代码在进入生产之前都将转换为JS。对于django,所有的react组件将只是已经编译的JS代码。

3)您可以使用Webpack自动将component.build.js移动到django可以为它们提供服务的文件夹中,例如component.build.js

4)您创建了一个django模板your_project/static/your_app/component.buid.js,它将用作所有模板将要扩展的基础模板。在这里,您将放置标头以及所有常见的脚本和样式。例如,如果使用引导程序,则应在此处。请记住,将块保留在此基本模板中,以在要扩展base.html的模板中使用它们。这是我们使用的base.html

base.html
© www.soinside.com 2019 - 2024. All rights reserved.