g:include VS multiple asset:javascript

23 views

Skip to first unread message

Scott Ingram

unread,

Oct 8, 2017, 3:51:58 PM10/8/17

to Grails Dev Discuss

I have numerous widgetFoo.gsp files that declare all the JS and CSS dependencies required to produce a fully functional FOO widget. This allows me to go directly to any given http://myapp/controllerBar/widgetFoo all by itself, or, to include widgetFoo and its siblings into a workbench.gsp that leverages g:include on widgetFoo, widgetBar, widgetEtc.

widgetFoo.gsp : <r:require modules="widget-foo"/> which declares (resource url:'widget/foo.js') and (dependsOn 'js-core')

widgetBar.gsp : <r:require modules="widget-bar"/> which declares (resource url:'widget/bar.js') and ALSO (dependsOn 'js-core')

workbench.gsp: says g:include widgetFoo and g:include widgetBar

In Grails 2 and the Resources Plugin, this worked great!

In Grails 3 and the Asset Pipeline, not so much...

widgetFoo.gsp : <asset:javascript src="/widget/foo.js"/> which declares //= require manifest-core-js

widgetBar.gsp : <asset:javascript src="/widget/bar.js"/> which ALSO declares //= require manifest-core-js

workbench.gsp: says g:include widgetFoo and g:include widgetBar

which then generates a page which includes multiple copies of the complete dependency tree. Mo widgets, mo problems.

Would this be considered a bug in Asset Pipeline?

I tried to workaround this behavior by placing the <asset> tags in the <HEAD> of the widgetX.gsp files and having workbench.gsp use <g:applyLayout name="body-only"> where layouts/body-only.gsp contained nothing but a <g:layoutBody>tag, but, that failed too, with identical results as before. I guess and <asset> tag isn't treated as an element of its enclosing HTML block.

I've concluded that I must remove the //= require manifest-core-js directives from widget/foo.js and widget/etc.js files where they belongs and move them into a layout/widget.gsp instead. This will allow me to bypass this problem by having my workbench.gsp do <g:applyLayout name="i-pretend-to-have-no-dependencies"><g:include widget/foo.js>. Even though this prunes the dependency tree incorrectly (widget/foo.js now lies and claims that it is free of any dependencies), opening up the possibility of assets being included in the wrong order, it works out fine in the end because Asset Pipeline continues bad behavior by inserting the <link> at the position of the <asset:javascript src="/widget/foo.js"/> tag. Yay?