unpkg support

[galtenberg]

I've not yet been able to build an example by importing from unpkg – I've tried these:

import autoAnimate from 'https://unpkg.com/@formkit/auto-animate'

import autoAnimate from 'https://unpkg.com/@formkit/auto-animate@1.0.0-beta.1/index.mjs'

Is there a proper form, or does support just require a bit more work?

[justin-schroeder]

Hmm, seems to work just fine for me?

https://codesandbox.io/s/priceless-thunder-m89xo6?file=/src/main.js

Is there a specific build setup you are using?

[galtenberg]

Hi @justin-schroeder – I'm not seeing use of unpkg in that example...

unpkg is used for no-build scenarios, where an entire package can be retrieved within an html page.

Code in an html page typically looks like:

<script type="module">
 
import { children, html, define, property, dispatch } from 'https://unpkg.com/hybrids@4.2.1/src'
import { fileOpen, directoryOpen, fileSave } from 'https://unpkg.com/browser-nativefs'
import autoAnimate from 'https://unpkg.com/@formkit/auto-animate'

// now use those imported functions in javascript

// just autoAnimate currently doesn't work

unpkg is just one way this is done – it's automatically provided for every package in npm.

It's just an extremely useful convenience for many situations. Supporting code-only imports sometimes requires a bit of structuring of the module such that functions work once they are imported this way.

It's not vital to solve for right now, except that it may instruct how module(s) best be defined (saves later refactors).

Thanks for considering 🍺

[justin-schroeder]

Sorry mate, I pasted the wrong url, wasn't even at code sandbox 😂 here's what I was trying to link to:

https://stackblitz.com/edit/web-platform-edhnls?file=index.html

[justin-schroeder]

@galtenberg perhaps you can provide a reproduction on stackblitz or other location where its not working and we can go from there.

[galtenberg]

Confirmed the example works for me, might have a different issue to report if I can isolate. Thanks for the test!