HTML Liquid Preview for Visual Studio CodeGives a rendered live preview for HTML based liquid templates. It uses the liquidjs npm package to do the rendering. Formatting of the template can be done by a separate command and is powered by Prettier and the Shopify Prettier Liquid Plugin This extension was inspired by YE Quing's - Braze Liquid Preview Which in turn was inspired by Trevor Kirchner's - Shopify Liquid Preview. This extension is designed to be complimentary to Liquid language support extensions such as Liquid and Shopify Liquid which provide features including syntax highlighting and auto-completion. PurposeWhen editing a template the output of which is HTML, I like the live rendered preview you get with the Braze plugin. However I didn't need the Braze extensions and I did want it to support all the standard Liquid syntax. I also tended to have some issues with other extensions in terms of formatting. Sometimes they auto-format when I don't want them to. Sometimes they format the liquid but not the HTML. I've added a format option as a separate command that can be run manually so as not to interfere with any other formatter that may have already been setup. Features
UsageUse the keybinding
Running locallyRunning with
See Testing Extensions for more info on testing VS Code extensions. |