I’m having an issue with my Shopify theme project. I installed the Shopify Liquid Extension in Visual Studio Code, but it’s not picking up on the script_tag when I try to load a JavaScript file in a section.
Is this normal behavior? I’m wondering if I missed a step or if there’s something I should double-check.
Here’s what I’m trying to do:
{{ 'my-custom-script.js' | asset_url | script_tag }}
But the extension doesn’t seem to recognize it. Has anyone else run into this problem? Any tips on how to troubleshoot or fix it would be really helpful. I’m kind of stuck and not sure where to go from here.
Thanks in advance for any advice!
As someone who’s been working with Shopify themes for a while, I can say that the Liquid Extension in VS Code can be a bit finicky at times. Your script_tag usage is correct, so don’t worry about that.
One thing I’ve found helpful is to use the Shopify Theme Inspector for Chrome alongside VS Code. It gives you real-time feedback on your Liquid code as you’re developing.
Also, double-check that your JavaScript file is actually in the assets folder of your theme. Sometimes the issue isn’t with the code, but with file placement.
If you’re still stuck, consider reaching out to Shopify’s developer forums. They have a wealth of knowledge and might be able to spot something we’re missing here.
hey there, ive run into this before too. the liquid extension can be a bit wonky sometimes. wat i usually do is just ignore the highlighting and test it on my dev store. if it works there, ur good to go. dont stress too much about the extension not picking it up, as long as shopify runs it ok ur fine. keep coding!
I’ve encountered similar issues with the Liquid Extension in VS Code. From my experience, it doesn’t always catch everything, especially with Shopify-specific tags like script_tag.
One workaround I’ve found is to use the standard script tag format instead:
<script src="{{ 'my-custom-script.js' | asset_url }}" defer></script>
This achieves the same result and tends to be recognized better by the extension. It’s not a perfect solution, but it’s helped me avoid syntax highlighting issues.
Another tip: make sure your file is saved with the .liquid extension. Sometimes VS Code gets confused if it’s just a .html file.
If you’re still having trouble, you might want to try a different Shopify-specific extension. There are a few out there that offer better Liquid support. Hope this helps!