syncify
syncify copied to clipboard
Remove Development code during build
Sometimes there's little piece of code that is helpful for local development, but not needed on the production environment. This feature was initially discussed on Shopify Devs discord, where others agreed it'd be a useful addition. Examples of where I'd use it would be -
// Move Syncify label if it interrupts with workflow
#syncify-hot-label-status {
z-index: -1 !important;
}
// cleanup States in JS
if (import.meta.hot) {
import.meta.hot.accept((newModule) => {
// Perform clean up of old state if needed
BundleStateManager.cleanup?.();
// Update the module
Object.assign(window, newModule);
});
}
A liquid comment could work, which ignores a few lines of code. This can be used to link dev-only assets and output test data.
So the HOT label is movable in next and IIRC states are automatically handled, its time to start rolling out next anyway, so let's iron out things.
https://github.com/user-attachments/assets/0e1e7426-197f-4277-bf09-be44fa578762