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

问题描述

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

不确定完全如何执行此操作。有哪些必要步骤？

我只用

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

在我的base.html文件中？

解决方法

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

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

另请注意，您展示的代码示例将来自 script 标签的 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

django django-static django-staticfiles