Hey folks, I’m hitting a pretty significant issue that seems tied to the dev platform migration. Hot reloading for extensions is completely broken - I’m having to restart the CLI after every single change just to see updates. Anyone else running into this? Any thoughts on what might be behind it?
…
I managed to get the watcher partially working by setting the extension_directories option to target the specific extension I’m developing, like: extension_directories = ["checkout-ext/**"] While this means I don’t have to restart Shopify CLI anymore, the browser hot reloading still isn’t functioning - I’m stuck manually refreshing the checkout page after every save. So it’s only a partial fix at this point.
Version 3.84.1
Hi @Patrick_Jakubik , thanks for the report and sorry your workflow is affected by this issues.
We just released CLI version 3.84.2 to address an issue with Checkout UI extensions during app dev. Could you please check if this version fixes your specific issue?
Regarding your toml configuration, what did you have before changing it to extension_directories = ["checkout-ext/**"]?
Also, remember that for hot-reloading to work you need to use the links from the dev console (pressing p in the CLI terminal). If you go directly to the store, hot reloading won’t work.
Let me know if this works for you!
Hey Issac, thanks for quick reply. I tried 3.84.2:
- hot reloading still doesn’t seem to work, I need to refresh the page. I’m opening checkout through Developer Console and clicking the extension target name
- before, my toml had:
extension_directories = ["*"]
Hi @Patrick_Jakubik , we’ve been trying to reproduce this issue with no luck so far.
I can say that extension_directories = [“**”] should also work fine, a single * means that it will try to find extension.toml files only in the root directory, and double ** means it will search in every subfolder. If you have a single extension, then extension_directories = ["checkout-ext"] is also valid
As an example, the default value of extension_directories when not set is extensions/**
With any of those variations hot-reload works for me. Do you see updates in the terminal when making any modification? Messages like “Build successful, extension changed…”? Trying to find where the issue might be.
Have you tried with with –-use-localhost? (just to discard things)
Thanks @Patrick_Jakubik !
Hi Isaac! Thanks for the tip!
with: extension_directories = ["*"] i get no build logs, however with extension_directories = ["**"] I do get:
13:11:56 │ checkout-ext │ Build successful
13:11:56 │ checkout-ext │ Extension changed
13:12:00 │ app-preview │ ✅ Updated app preview on ***.myshopify.com
The reloading is still not working though, no matter if I run it with:
shopify app dev --config shopify.app.dev.toml --tunnel-url=https://*****.ngrok.dev:3001
or
shopify app dev --config shopify.app.dev.toml --use-localhost
Hey @Patrick_Jakubik –
Can you check one more thing for us? In your browser dev tools, do you see the websocket events for hot reloading?
You should see a ‘connected’ and then when you make a change, an ‘update’.
This will only be the case if you’ve previewed the extension via the Dev Console, as you described.
-Nick
Hey Nick, not sure if you guys did something on your side, but things started to work today! I tested checkout extensions and admin extensions and reloading works perfectly now! Seems also faster then the previous versions 
Thanks a lot!
1 Like
