django - 如何在 Django 中使用节点模块？

Question

我希望在我的 django 项目中使用 date-fns 但不确定如何继续 - 我不能依赖 CDN 并且需要以某种方式安装它。我在我的根文件夹中运行了 npm init，然后是 npm install date-fns。这会生成一个 node_modules 文件夹和一个 package.json 文件。

不完全确定此后如何进行。有哪些必要步骤？

我只用吗

<script src="{% static 'node_modules/date-fns' %}"></script>

在我的 base.html 文件中？

Answer 1

使用 static 模板运算符时使用的搜索路径在 STATICFILES_DIR 的 settings.py 文件中定义(docs) .这将允许静态运算符找到库文件并生成 URL。

但是请注意，网络服务器仍需要从 STATIC_URL 定义的预期路径提供文件。项目根目录中的 manage.py 工具包含一个命令 collectstatic可以将所有静态搜索目录复制到一个位置，以简化这些文件的服务。

另请注意，您展示了一个代码示例，该示例从脚本标记中将 npm 库目录作为脚本引用，但浏览器将不知道如何从该目录中找到该脚本。 node 通常使用库的 package.json 来寻找入口点。需要专门调出包内感兴趣的脚本文件。

一种选择是使用 webpack 或 rollup 等捆绑工具将所有资源收集到一个位置。

另一种选择是将 node_modules 路径添加到静态路径，可能带有前缀。它可能类似于以下内容。

STATIC_URL = '/static/'
STATIC_ROOT = 'dist/static/'
STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'static'),
    # This defines a prefix so the url paths will become `/static/node_modules/...`
    ('node_modules', os.path.join(BASE_DIR, 'node_modules/')),
)

特别包括 index.js 而不仅仅是模板文件中的 date-fns。

{% load static %}
<!-- .... -->
<script src="{% static 'node_modules/date-fns/index.js' %}"></script>

如果从 STATIC_ROOT 收集和提供静态文件，以下命令将收集 STATICFILES_DIRS 内容，在本例中，收集到 dist/static。

python manage.py collectstatic