Как я могу использовать модули NPM с Django внутри приложения?
У меня есть проект Django с 2 приложениями. Я хочу использовать Notion API в одном из приложений, поэтому мне нужно установить его модуль NPM. Однако я никогда не использовал ни NPM, ни bundler (я понимаю, что должен использовать его для оператора import).
Я понятия не имею, как это сделать. Где я должен установить модуль? Должен ли я установить Webpack или что-то подобное? Как я могу интегрировать обе эти технологии с Django?
Может кто-нибудь объяснить мне это, или дать ссылку на статью/видео с объяснениями?
Я пытаюсь уже несколько часов и не могу найти ничего подробного.
Я проверил следующие ссылки:
- Django как использовать модули npm со статическими/шаблонами
- https://gist.github.com/brizandrew/685a588fbefbd64cd95ed9ec4db84848 .
- https://www.saaspegasus.com/guides/modern-javascript-for-django-developers/integrating-javascript-pipeline/
- https://www.saaspegasus.com/guides/modern-javascript-for-django-developers/integrating-javascript-pipeline/ .
- https://www.techiediaries.com/django-webpack-react/
- https://owais.lone.pw/blog/webpack-plus-reactjs-and-django/ .
- https://pythonrepo.com/repo/owais-django-webpack-loader-python-developing-restful-apis
И многое другое.
В них либо нет того, что мне нужно (они для реакции), либо я просто не могу их понять. Я знаю, что, вероятно, есть много статей об этом, но либо я просто не могу их найти, либо они слишком сложны для меня (извините, я тупой).
Если кто-нибудь может мне помочь, это сделает мой день.
Спасибо!
P.S. Я использую Typescript, но при необходимости могу использовать ванильный JS.
Вам нужно сделать две вещи, чтобы заставить ваше приложение работать так, как вы хотите.
- Установите, настройте и запустите пакет модулей
- Использовать
collectstatic
Модуль bundler:
У вас есть несколько вариантов, но большинство используют webpack, потому что он самый популярный. Я предпочитаю rollup, но все зависит от предпочтений.
быстрый старт: https://rollupjs.org/guide/en/#quick-start
webpack: https://webpack.js.org/concepts/
Поскольку вы используете Typescript, смотрите плагины для связки Typescript
https://webpack.js.org/guides/typescript/
https://github.com/rollup/rollup-plugin-typescript
После создания пакета у вас должен быть файл main.js
или его эквивалент. Убедитесь, что main.js
находится в своей собственной папке. Обычно бандлеры делают это за вас.
Добавьте этот каталог к вашему STATICFILES_DIRS
в settings.py
.
Обратите внимание, что для работы этой функции вам потребуется установить STATIC_ROOT
. Это будет папка, в которой вы будете хранить собранные статические файлы.
Запуск python manage.py collectstatic
Примечание: если вы используете python manage.py runserver
для запуска приложения, вам не нужно запускать collectstatic