Skip to content
This repository was archived by the owner on Oct 16, 2024. It is now read-only.

Commit 33977af

Browse files
authored
Static imports (#17)
1 parent 1f4a172 commit 33977af

File tree

6 files changed

+78
-7
lines changed

6 files changed

+78
-7
lines changed

README.md

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -138,6 +138,28 @@ When it renders you should get something like this:
138138
</html>
139139
```
140140

141+
## Adding static files to import maps
142+
143+
You can include your own static files in the import map by passing kwargs to the `{% importmap_scripts %}` tag.
144+
You can actually use this to include any additional imports, but by using `{% static "name" as name_static %}` you can get the URL to the static file.
145+
146+
```html
147+
{% load importmap static %}
148+
<!DOCTYPE html>
149+
<html lang="en">
150+
<head>
151+
{% static "my-script.js" as my_script_static %}
152+
{% importmap_scripts myscript=my_script_static %}
153+
<script type="module">
154+
import MyScript from "myscript"
155+
</script>
156+
</head>
157+
<body>
158+
159+
</body>
160+
</html>
161+
```
162+
141163
## Using Jinja2
142164

143165
To use django-importmap with Jinja2 templates,
@@ -192,6 +214,29 @@ Then in your Jinja templates you can include a module shim and output the `impor
192214
</html>
193215
```
194216

217+
To include your own static files in the import map,
218+
you can pass a dictionary of names and URLs to the `Importmap.json` method:
219+
220+
```python
221+
from django.conf import settings
222+
from django.templatetags.static import static
223+
from jinja2 import Environment
224+
225+
from importmap import Importmap
226+
227+
228+
def environment(**options):
229+
env = Environment(**options)
230+
env.globals.update(
231+
{
232+
"importmap": Importmap.json(
233+
development=settings.DEBUG, extra_imports={"myjs": static("myjs.js")}
234+
)
235+
}
236+
)
237+
return env
238+
```
239+
195240
## Project status
196241

197242
This is partly an experiment,

importmap/core.py

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -47,13 +47,19 @@ def __init__(
4747
self.load()
4848

4949
@classmethod
50-
def json(cls, development=False):
50+
def json(cls, *, development=False, extra_imports={}):
5151
importmap = cls()
5252

5353
if development:
54-
return json.dumps(importmap.map_dev, indent=2, sort_keys=True)
54+
imap = importmap.map_dev
55+
indent = 2
5556
else:
56-
return json.dumps(importmap.map, sort_keys=True)
57+
imap = importmap.map
58+
indent = None
59+
60+
imap.get("imports", {}).update(extra_imports)
61+
62+
return json.dumps(imap, indent=indent, sort_keys=True)
5763

5864
def load(self):
5965
# TODO django check to compare lock and config hash

importmap/templatetags/importmap.py

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,5 +9,9 @@
99

1010

1111
@register.inclusion_tag("importmap/scripts.html")
12-
def importmap_scripts():
13-
return {"importmap": Importmap.json(development=settings.DEBUG)}
12+
def importmap_scripts(**extra_imports):
13+
return {
14+
"importmap": Importmap.json(
15+
development=settings.DEBUG, extra_imports=extra_imports
16+
)
17+
}

test_project/app/jinja2.py

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,17 @@
11
from django.conf import settings
2+
from django.templatetags.static import static
23
from jinja2 import Environment
34

45
from importmap import Importmap
56

67

78
def environment(**options):
89
env = Environment(**options)
9-
env.globals.update({"importmap": Importmap.json(development=settings.DEBUG)})
10+
env.globals.update(
11+
{
12+
"importmap": Importmap.json(
13+
development=settings.DEBUG, extra_imports={"myjs": static("myjs.js")}
14+
)
15+
}
16+
)
1017
return env

test_project/app/templates/index.html

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,8 @@
77
<meta name="viewport" content="width=device-width, initial-scale=1.0">
88
<title>Document</title>
99

10-
{% importmap_scripts %}
10+
{% static "myjs.js" as myjs_static %}
11+
{% importmap_scripts myjs=myjs_static %}
1112
<script type="module" src="{% static 'app.js' %}"></script>
1213
</head>
1314
<body>

test_project/tests.py

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,8 @@ def test_template_output(self):
1818

1919
self.assertContains(response, "react@17.0.2/index.js")
2020

21+
self.assertContains(response, "/static/myjs.js")
22+
2123
@override_settings(DEBUG=True)
2224
def test_template_output_dev(self):
2325
url = reverse("index")
@@ -30,6 +32,8 @@ def test_template_output_dev(self):
3032

3133
self.assertContains(response, "react@17.0.2/dev.index.js")
3234

35+
self.assertContains(response, "/static/myjs.js")
36+
3337
@override_settings(DEBUG=False)
3438
def test_jinja_template_output(self):
3539
url = reverse("index_jinja")
@@ -40,6 +44,8 @@ def test_jinja_template_output(self):
4044

4145
self.assertContains(response, "react@17.0.2/index.js")
4246

47+
self.assertContains(response, "/static/myjs.js")
48+
4349
@override_settings(DEBUG=True)
4450
def test_jinja_template_output_dev(self):
4551
url = reverse("index_jinja")
@@ -49,3 +55,5 @@ def test_jinja_template_output_dev(self):
4955
self.assertContains(response, "es-module-shims.js")
5056

5157
self.assertContains(response, "react@17.0.2/dev.index.js")
58+
59+
self.assertContains(response, "/static/myjs.js")

0 commit comments

Comments
 (0)