Adds JavaScript syntax highlighting inside TYPO3 Fluid <f:asset.script> blocks.
What It Does
This extension injects the standard JavaScript grammar into the content of TYPO3 Fluid <f:asset.script> tags. The surrounding Fluid and HTML tag syntax stays highlighted as markup, while the block body is treated as JavaScript.
Example
<f:asset.script identifier="frontend-behavior">
document.addEventListener('DOMContentLoaded', () => {
const toggle = document.querySelector('[data-toggle]');
if (toggle) {
toggle.addEventListener('click', () => {
console.log('ready');
});
}
});
</f:asset.script>
Inside the block body, VS Code uses its normal JavaScript syntax highlighting.
Scope
- Targets block-style
<f:asset.script>...</f:asset.script>usage in Fluid templates. - Injects JavaScript only into the block content.
- Works by extending the HTML/TextMate grammar used for Fluid-like HTML templates.
Limitations
- This extension adds syntax highlighting only. It does not add formatting, IntelliSense, linting, or diagnostics.
- It currently targets block-style
<f:asset.script>tags, not self-closing variants. - Highlighting quality still depends on the base grammar used by the active Fluid or HTML syntax.