uicrooks / shopify-theme-lab

Shopify theme development environment using Liquid, Vue and Tailwind CSS. Built on top of Shopify CLI 🧪
https://uicrooks.github.io/shopify-theme-lab-docs/
MIT License
727 stars 128 forks source link

[Bug]: Static assets not loaded after pushing to shopify #168

Open soggie opened 1 year ago

soggie commented 1 year ago

Operating system

Ubuntu

Node.js version

16

Shopify CLI version

2.18

Browsers

Chrome

Version

4 (Current)

Modifications

No response

Details

  1. Put a few image files (e.g. test.static.png) in the /shopify/assets directory
  2. Create a page, and use them as a normal asset like: <img src="/assets/test.static.png">, or within a vue component
  3. Test on local with shopify theme serve, verify that it works
  4. Push to shopify
  5. View it on live shopify, verify that it doesn't show up. Expectations: image shows up on both local and production

Notice

TomJacobsUK commented 1 year ago

Are you accounting for the Shopify CDN?

Normally assets on shopify would be loaded via <img src="{{ 'test.static.png' | asset_url }}" /> or {{ 'test.static.png' | asset_url | img_tag: 'test' }} in a liquid template.

With the Vue component, you may need to reference the file relatively instead of absolute (Untested).