django - 使用 Django 设置 Webpack

Question

我通过django-webpack-loader在 Django 中开发一个 Vue 应用程序，在本地运行我可以通过在我的base.html文件中使用以下内容来使其工作：

{% load render_bundle from webpack_loader %}
...
...
{% render_bundle 'app' %}

但是，在生产中这不起作用 - 我相信因为 webpack 生产配置使用 CommonChunksPlugin 将包拆分为app,manifest和vendor.

将 Webpack 与 Django 合并的在线文档并不多——我想知道是否有办法在 Django 模板中包含所有块。

Answer 1

最终的问题是由于代码拆分。在 dev 中，创建了一个 JS 文件，但在生产配置中，WebpackCommonChunksPlugin被配置为将应用程序拆分为 3 个文件（清单、供应商和应用程序）。

此解决方案并不理想，可能无法很好地扩展，但通过在 Django 模板中放置条件标记，我能够正确引用必要的文件。

{% if STAGE or PRODUCTION %}
  {% render_bundle 'vendor' 'js' %}
  {% render_bundle 'manifest' 'js' %}
{% endif %}

{% render_bundle 'app' 'js' %}

Answer 2

您是否编辑了 settings.py 以指向捆绑目录？

APP_DIR = os.path.join(BASE_DIR, 'app')
WEBPACK_LOADER = {
    'DEFAULT': {
        'BUNDLE_DIR_NAME': 'dist/'
    }
}

STATICFILES_DIRS = (
    os.path.join(APP_DIR, 'assets'),
)

然后使用 HtmlWebpackPlugin 指向块？https://github.com/jantimon/html-webpack-plugin/blob/master/README.md#writing-your-own-templates

plugins: [
    new HtmlWebpackPlugin({
      template: 'static/app/index.html'
    }), 
]