[2.0] Webpack installation, global HTMX properties undefined about htmx

[1cg]

may be related to #2629

not familiar w/ webpack does it use any of the javascript modules? if so you might need to switch to the new module-specific files in the distribution

[Jesmaster]

The webpack installation documentation hasn't been updated so I assumed the setup is the same. None of the other js libraries I use in webpack need to specifiy any special module types.

https://htmx.org/docs/#webpack

[1cg]

entirely possible that those instructions are wrong now, unfortunately, since no one on the core team that I'm aware of uses webpack. We will get the .d.ts file fixed in the next release and then we can try again, and then maybe try by referencing one of the module files (/dist/htmx.esm.js ?) and then update the docs if necessary. Can you try referencing the esm file now just to see if it does anything different?

[Jesmaster]

I figured out how to set it up correctly. I'll create a pull request to fix the documentation.

For anyone who needs it

window.htmx = require('htmx.org');

becomes

import htmx from "htmx.org/dist/htmx.esm";
window.htmx = htmx;

[restless]

Thanks @Jesmaster you've helped me to resolve my issue.

I use Vite and I had to do a similar change there. In the vite.config.js file i had to replace htmx.org with the htmx.org/dist/htmx.esm:

    plugins: [
      inject({
        htmx: 'htmx.org/dist/htmx.esm',
      }),
    ],

This is related to: #1690