htmx

How to import HTMX variable?


I am using HTMX attributes on some dynamically generated DOM elements. HTMX is not working, as stated in the docs unless you call htmx.process().

When I tried to call this, I get - correctly - the error:

Uncaught ReferenceError: htmx is not defined

Any idea how I can import this htmx variable? No idea how the example in the docs can work.

Thx!


Solution

  • The non-module version of htmx.org defines a global, but you're using modules (via import). Half the point of modules is to do away with globals, and so the module version of it won't create a global, it'll provide an export.

    In a deleted comment you said the actual import is import "htmx.org" (not import htmx.org as in the comment that's still there). That being the case, you likely want one of these:

    // Importing the default export
    import htmx from "htmx.org";
    // Or importing the module namespace object
    import * as htmx from "htmx.org";
    // Or importing a named export, but looking at the file I doubt you want this one
    import { htmx } from "htmx.org";
    

    Most likely, you want the first one.

    You'd do that in the module where you're doing the htmx.process() call.