Theme app extension development - load a localhost script for faster dev

Solved
tunisoft
Excursionist
13 3 0

Hi,

Can I link to a local script during dev?

I tried this code inside the liquid template (i'm using vitejs)

 

<script type="module" src="http://localhost:8081/src/product/index.ts" async></script>

 

But i'm not having much luck with that

I get this error when I run `shopify extension push`

 

An unexpected error occurred on Shopify.

This command ran with ID: 59950
Please include this information in any issues/report along with relevant logs
/usr/local/Cellar/shopify-cli/2.1.0/gems/shopify-cli-2.1.0/lib/project_types/extension/tasks/update_draft.rb:21:in `call': undefined method `dig' for nil:NilClass (NoMethodError)

 

Is it possible to link a localhost script for faster dev iteration?

Thank you

 

0 Likes
tunisoft
Excursionist
13 3 0

This is an accepted solution.

I managed to add the dev scripts like so

 

<script>
  function insertScript(src) {
    var s = document.createElement("script");
    s.setAttribute("src", src);
    s.setAttribute("type", "module");
    document.body.appendChild(s);
  }

  insertScript("http://localhost:8081/@vite/client");
  insertScript("http://localhost:8081/src/product/index.ts");
</script>

 

The theme extension is BRILLIANT but the dev cycle is not that great, you have to exec `shopify extension push` then "Create version" then wait for a minute to view your liquid changes

0 Likes