Skip to main content

Add importmaps to your Django project

Project description

lfp-importmap

A simple way to use Javascript importmaps in your Django projects.

What can you do with it?

Use Javascript libraries in your Django projects without having to install node and related tooling. No frontend build system required!

How to use it?

  1. Add lfp_importmap to your INSTALLED_APPS in your settings.py
INSTALLED_APPS = [
    ...
    'lfp_importmap',
]
  1. Add any JS library using the new management command:
python manage.py importmap add htmx.org

This will create an importmap.config.json file in your project root. It will also vendor the package code and make it available in your templates.

  1. In your base.html template, add the following:
{% load lfp_importmap %}

<html>
  <head>
    ... {% javascript_importmap_tags %}
  </head>
  <body>
    ...
  </body>
</html>
  1. That's it! The module is now ready for use in your templates.

Continuing the example from above, you can now use the htmx module in your templates:

<button hx-get="{% url 'my-url-name' %}">Click me</button>

LICENSE

MIT

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

lfp_importmap-0.1.0.tar.gz (20.4 kB view details)

Uploaded Source

Built Distribution

If you're not sure about the file name format, learn more about wheel file names.

lfp_importmap-0.1.0-py3-none-any.whl (5.6 kB view details)

Uploaded Python 3

File details

Details for the file lfp_importmap-0.1.0.tar.gz.

File metadata

  • Download URL: lfp_importmap-0.1.0.tar.gz
  • Upload date:
  • Size: 20.4 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? No
  • Uploaded via: uv/0.5.13

File hashes

Hashes for lfp_importmap-0.1.0.tar.gz
Algorithm Hash digest
SHA256 d60f9be9d9be00caea9c5e96c71ef4a61e54f24dea01bc26c23ea83d7dbd06ed
MD5 32f02509a5d81915e40e4acc1db8e1ee
BLAKE2b-256 eb8cec3cb08a9dc1b82b263c43c27e11d278e66c23d018455e4d5dd2b682f069

See more details on using hashes here.

File details

Details for the file lfp_importmap-0.1.0-py3-none-any.whl.

File metadata

File hashes

Hashes for lfp_importmap-0.1.0-py3-none-any.whl
Algorithm Hash digest
SHA256 8ea701ac088eb0cf5690a5abac6d305cb622c6cccb45198ef2364196b5d93cfd
MD5 513223e9af7e762ea5739b15b37b98ee
BLAKE2b-256 d204ca25dbaa56c3f5cb9a23e268f926a9a852bcae1bff48bf83bdea645e303c

See more details on using hashes here.

Supported by

AWS Cloud computing and Security Sponsor Datadog Monitoring Depot Continuous Integration Fastly CDN Google Download Analytics Pingdom Monitoring Sentry Error logging StatusPage Status page