0

我在 Django 和 React 上构建了一个应用程序，一旦我DEBUG=False在我的 Djangosettings.py文件中设置，它就会在移动浏览器和 Safari（桌面）上显示一个空白页面。

我检查了浏览器控制台网络选项卡，发现 Safari 似乎无法读取我的 react javascript 包。

在此处输入图像描述

我检查了 Safari 上的网络选项卡，同时打开和关闭了调试，看看文件的服务方式是否有任何差异，并发现了这一点：

Debug=False（应用未加载）

带有调试错误的 Safari 网络选项卡

如您所见，响应Content-Disposition告诉我文件的扩展名是.js.gz- 这最终显示了我在第一个屏幕截图中链接的文件的“损坏”版本。

Debug=True（应用按预期工作）

带有调试 true 的 Safari 网络选项卡

将 debug 设置为 true 时，它​​会加载同一文件的不同版本。文件名略有不同，文件扩展名是.js

我使用 webpack 来捆绑这些文件，并使用一个包django-webpack-loader将它们注入到我的 HTML 模板中。

其中的代码settings.py可能是相关的：

# django-webpack-loader
if DEBUG:
    WEBPACK_LOADER = {
        'DEFAULT': {
            'BUNDLE_DIR_NAME': '',
            'STATS_FILE': os.path.join(BASE_DIR, 'webpack-stats.json'),
            'TIMEOUT': 10,
        },
    }
if not DEBUG:
    WEBPACK_LOADER = {
        'DEFAULT': {
            'BUNDLE_DIR_NAME': '',
            'STATS_FILE': os.path.join(BASE_DIR, 'webpack-stats-prod.json'),
            'TIMEOUT': 10,
        },
    }

# static files
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, "frontend/static/frontend"),
    os.path.join(BASE_DIR, "static")
]

在我的 index.html 模板中，我注入了 webpack-loader 创建的包，如下所示：

{% render_bundle "main" "js" "DEFAULT" attrs='charset="UTF-8"'%}

我错过了什么？如何解决这个问题？

4

0 回答 0