<p>You achieve this by adding a param to the tag:</p>
<pre><code>{% js 'path/to/jsfile.js' with { type:'module' } %}

// outputs &lt;script type=&quot;module&quot; src=&quot;path/to/jsfile.js&quot;&gt;
</code></pre>

CC BY-SA 4.0
2022-05-13T09:52:10.397Z
2022-05-13T09:52:10.397Z
Robin Beatty
<p>I'm not sure this is possible, but another approach would be to create a new extendable block in your parent template:</p>
<pre><code>// layout.twig

{% block scripts %}

{% endblock %}
</code></pre>
<pre><code>// component.twig

{% extends 'layout.twig' %}

{% block scripts %}
    &lt;script type=&quot;module&quot;&gt;
        // script here
    &lt;/script&gt;
{% endblock %}
</code></pre>

CC BY-SA 4.0
2020-09-22T11:08:00.807Z
2020-09-22T11:08:00.807Z
dmatthams
<p>Hi hope you can help with this and hoping it's simple. I need to write a javascript module and would like to use the js tag:</p>
<pre><code>{% js %}

        //script here

{% endjs %}
</code></pre>
<p>This is good because it only gets embedded when needed and it gets placed at the bottom of the page and I can add craftcms variables to it. The problem I have is that the script is being outputted as</p>
<pre><code>&lt;script&gt;
// script here
&lt;/script&gt;
</code></pre>
<p>and what I need is</p>
<pre><code>&lt;script type=&quot;module&quot;&gt;
// script here
&lt;/script&gt;
</code></pre>
<p>Any idea how I can do that?
Thanks</p>

<javascript>
javascript module question
# javascript module question

(Asked by: username_0 on 2020-09-21)

Hi hope you can help with this and hoping it's simple. I need to write a javascript module and would like to use the js tag:
{% js %}

        //script here

{% endjs %}

This is good because it only gets embedded when needed and it gets placed at the bottom of the page and I can add craftcms variables to it. The problem I have is that the script is being outputted as


and what I need is


Any idea how I can do that?
Thanks

**Tags:** javascript

---

## 2 answers

### Answer by username_1 on 2022-05-13. Score: 4

You achieve this by adding a param to the tag:
{% js 'path/to/jsfile.js' with { type:'module' } %}

// outputs


---

### Answer by username_2 on 2020-09-22. Score: 2

I'm not sure this is possible, but another approach would be to create a new extendable block in your parent template:
// layout.twig

{% block scripts %}

{% endblock %}

// component.twig

{% extends 'layout.twig' %}

{% block scripts %}
    
{% endblock %}


---

