ayushn21/bridgetown-svg-inliner

Bridgetownrb returns an error when using {% svg "path" %} in a code piece

Closed this issue · 6 comments

JuanVqz commented

As I said in my blog I wanted to show off how to install and use this gem in Bridgetown

when I was writing in a markdown file and put the following lines as code blocks, the compiler just breaks down.

<!-- Liquid -->
{% svg "/assets/icons/thumbs-up.svg" %}
<!-- ERB -->
<%= svg "/assets/icons/thumbs-up.svg" %>

in order to solve the problem, I put a # to scape the code.

<!-- Liquid -->
{#% svg "/assets/icons/thumbs-up.svg" %}
<!-- ERB -->
<#%= svg "/assets/icons/thumbs-up.svg" %>

reference article

ayushn21 commented

Thanks for flagging this @JuanVqz. Not sure why this is happening but will investigate as soon as I can!

  • 🎉1
ayushn21 commented

Hey @JuanVqz, I've tested this on Bridgetown 0.21.2 using Ruby 2.7.3 and 3.0.2 and been unable to reproduce the issue. The site is built without errors and renders as expected. Could you please post a test repo for me where I can reproduce and diagnose the error? Thanks :)

  • 👍1
JuanVqz commented

sure! I'll do it this afternoon. I ran bridgwtown --version and returns v0.21.3 "Broughton Beach" using ruby 3.0.0

JuanVqz commented

@ayushn21 when I got the error I just put both liquid and erb formats in the markdown file, so I didn't double check which one was the cause of the error I saw.

I tested it again and nothing failed now the {% svg "images/github.svg" %} is converted to a svg.

here is the commit

this is the repo and this is the post where you can see it as SVG tag instead of a liquid tag.

erb format is working as expected

svg_liquid

ayushn21 commented

Thanks @JuanVqz for the example repo. I'm not sure exactly what you're trying to accomplish but I hope the following answers your questions.

  • You cannot use ERB and Liquid tags in the same file. You have to choose and specify your template_engine in the frontmatter.
  • If you'd like to print out the Liquid or ERB tags themselves rather than "render" them, you need to escape those tags so the template engine doesn't render them and just displays them as-is. That is not within the scope of this library. Please see this StackOverflow post to for an example of how to escape Liquid tags: https://stackoverflow.com/questions/3426182/how-to-escape-liquid-template-tags.
  • As an example, this will print out the raw Liquid tag as is instead of rendering it: {{ "{% svg 'images/github.svg' " }}%}.

Hope this helps!

  • 👍1
JuanVqz commented

you are right I wanted to escape the liquid tags. thank you for your time

  • 👍1