{% js %}
// some JavaScript
{% endjs %}
Renders after Asset Bundles' <script> elements have rendered, as expected. The code may depend on one of those script files.
{% js "plugin/plugin.js" with {type:'module'} %}
Renders before Assets Bundles' <script> elements have rendered. The code cannot depend on those script files.
with can't be used on a code block, so type="module" can't be added to a JavaScript code block that fires after the Asset Bundles, and if it's added to a file reference, it appears before the necessary referenced files.
Shouldn't at endbody consistently output both code blocks and JS files after the Asset Bundles?
The ideal solution would be to be able to output type="module" on the script tag for an Asset Bundle resource. I've been trying to find a work around for that limitation.
Use either of the {% js %} tags above to observe that JS is output before or after Asset Bundles are rendered, depending on whether it's a file reference or code block.
Just added a new {% script %} tag for the next release, which works similarly to {% js %} except that you get full control of the tag attributes. So you could do this:
{% script with {type: 'module'} %}
// some JavaScript
{% endscript %}
To get it early, change your craftcms/cms requirement in composer.json to "dev-release/3.6.11" and run composer update.
Thanks!
Craft 3.6.11 is out now with the new {% script %} tag ✨
Most helpful comment
Just added a new
{% script %}tag for the next release, which works similarly to{% js %}except that you get full control of the tag attributes. So you could do this:To get it early, change your
craftcms/cmsrequirement in composer.json to"dev-release/3.6.11"and runcomposer update.