Dynamic asset names

[wrozka]

Problem

I'm using a liquid template to generate img tags with srcsets. Referenced images give 404. It stopped working after upgrading to 1.x

Replication steps

It works fine with static name:

<img src="{{  '../assets/images/b.jpg'  | asset_url }}">

It doesn't work if the images is referenced by a variable. It returns 404 on localhost and it doesn't get copied to dist/assets.

{% assign b = '../assets/images/b.jpg' %}
<img src="{{ b | asset_url }}">

More Information

I'm using slate-tools 1.0.0-beta.2

[t-kelly]

This might eventually be possible when Slate can properly parse Liquid

[wrozka]

@t-kelly I migrated my theme to 1.x to enable React, ES6 and other build tools, and it was super to enable JSX transformation, etc. But this a really big issue for me, as I cannot use my old liquid templates. Is there any workaround besides inlining all the variables? Is it possible to generate asset_urls during the build?

[t-kelly]

Is it possible to generate asset_urls during the build?

Yes it's possible, but to do so we need to be able to properly parse Liquid off of Shopify servers. This will take some time to accomplish and needs to be prioritized with the rest of Slate's backlog.

[wrozka]

Thanks. Is it possible to generate asset urls without liquid? I want to use them in react components.

[t-kelly]

No you need Liquid. In the past, we have typically access Liquid values with JS by declaring the values we need on a global JS variable. For example in the main layout file we declare:

<script>
var liquidData = {
  myValue: {{ product.image | asset_url }}
}
</script>

[wrozka]

Ok, thanks!

[t-kelly]

Assets have been simplified in #850 and the change is now available in v1.0.0-beta.12

Docs that have also been updated:

• https://github.com/Shopify/slate/wiki/Slate-themes
• https://github.com/Shopify/slate/wiki/Template-and-layout-bundles
• https://github.com/Shopify/slate/wiki/Local-development

[lock]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.