使用create react app with django
django-create-react-app的Python项目详细描述
django创建react应用程序
这个应用程序帮助我们通过创建react应用程序模板在django项目中集成react。这个应用程序可以在react的开发和生产模式下工作。在
快速入门
安装
pip install django-create-react-app
将“create_react_app”添加到已安装的应用程序设置中，如下所示：
^{pr2}$设置配置
在设置中添加构建目录
yarn build or npm run build
这将在react文件夹中创建生成目录。在django设置中添加这个构建目录，例如
REACT_BUILD_DIRECTORY = os.path.join(BASE_DIR, 'app', 'react', 'build')
将create react app配置添加到您的设置中：：
CREATE_REACT_APP = {
'DEFAULT': {
'BUNDLE_DIR_NAME': REACT_BUILD_DIRECTORY,
'FRONT_END_SERVER': "http://localhost:3000/",
'is_dev': False,
}
}
在模板中使用它：：
{% load react_bundle_loader %}
<html>
<head>
{% render_bundle_css %}
</head>
<body>
....
{% render_bundle_js %}
</body>
</head>
为Collectstatic Finder添加以下代码以查找生成文件夹：：
STATICFILES_DIRS = (
os.path.join(REACT_BUILD_DIRECTORY, 'static'),
)
#在django项目中添加多个React应用程序
CREATE_REACT_APP = {
'DEFAULT': {
'BUNDLE_DIR_NAME': CLIENT_FRONTEND_BUILD,
'FRONT_END_SERVER': "http://localhost:3000/",
'is_dev': True,
},
'ADMIN': {
'BUNDLE_DIR_NAME': ADMIN_FRONTEND_BUILD,
'FRONT_END_SERVER': "http://localhost:3001/",
'is_dev': True,
},
}
在模板内呈现react admin应用程序：：
{% load react_bundle_loader %}
<html>
<head>
{% render_bundle_css ADMIN %}
</head>
<body>
<div id="root"></div>
{% render_bundle_js ADMIN %}
</body>
</head>
- 项目
标签：
欢迎加入QQ群-->： 979659372
