Help with Importing JavaScript Module from main-product.liquid in Shopify

[WalkYourStyle]

Hi everyone,

I'm encountering an issue with JavaScript modules in my Shopify store, and I could really use some help.

I've added a script tag in main-product.liquid like this:

<script type="module">
  const product = document.querySelector(".product");
  const productSizes = product.dataset.productSizes;
  export { productSizes };
</script>

This file is located in the Sections folder.

Then, in size-guide-1.js.liquid which is in the Assets folder, I tried to import productSizes like this:

import productSizes from "{% section 'main-product' %}";

However, this doesn't seem to work, and I get the following error:

TypeError: Failed to resolve module specifier "". Invalid relative URL or base scheme isn't hierarchical.

Can anyone help me understand why this import is failing and how to properly import the productSizes variable from main-product.liquid into size-guide-1.js.liquid?

Thanks in advance!

[WalkYourStyle]

Ignore this message.