Clojurians Log v2

If I remove require and try (js/$.Alert "Hello") I get this error

for reference, I was able to use

(:require ["jquery" :as jq]))

(-> (jq ".options-form") (.serialize))

Does jquery have an Alert function?

This is not shadow

I don't see .Alert being defined in the $ object here: https://codepen.io/jbalsamo/pen/OVdOPV

When I write:

console.log($)
console.log($.Alert)

I see:

ƒ (a,b){return new n.fn.init(a,b)}
iframeConsoleRunner-6bce046e7128ddf9391ccf7acbecbf7ce0cbd7b6defbeb2e217a867f51485d25.js:1 undefined

Ok, thanks. I will find a better function to test. I was going off this https://www.sitepoint.com/ways-jquery-alert/ ps. I understand it’s not shadow, just providing my baseline experience to try to better understand the differences in requiring dependencies.

oh thats from 2011 😵

what is?

that linked article

You probably won't need jquery in 2022 anyway, there is a lot of stuff in the browser now

https://youmightnotneedjquery.com/

Thanks. I have a call to a (malformed?) endpoint that seems to return html response (instead of json). And jquery.ajax somehow successfully interprets as jsonp. I tried fetch and couldn’t get it to work, even with help from the cljs channel..

ok :)

Well, if you include jquery in a script tag, you have the js/$ available in scittle scripts, that's how it currently works.

Ok, it is indeed working like that. ex: (-> (js/$ ".target-elem") (.addClass "text-red-500")) Works! 🎉

It depends

What module format is bundle.js compiled in?

Currently this doesn't matter, but in the future scittle may be able to :require es6 modules directly

Currently it only works if a foo.js file included in a script tag defines some global or you can import it as a module and then manually define some globals

Like here: https://twitter.com/borkdude/status/1528110797884473345 I have this in a branch

Thanks, I will look at that> Not sure the format. It is an older codebase using Webpack / Babel. Here is the webpack config.

var webpack = require('webpack');

module.exports = {
    devtool: 'source-map',
    bail: true,
    module: {
        loaders: [
            {
                test: /\.js$/,
                loader: 'babel',
                include: /(assets\/js|assets\\js|node_modules\/@bigcommerce\/stencil-utils|node_modules\\@bigcommerce\\stencil-utils)/,
                query: {
                    compact: false,
                    cacheDirectory: true,
                    presets: ['es2015-loose'],
                }
            }
        ]
    },
    plugins: [
        new webpack.ProvidePlugin({
            $: 'jquery',
            jQuery: 'jquery',
            'window.jQuery': 'jquery'
        })
    ],
    watch: false
};

you may be able to deal with that with requirejs in the browser, then pull out the module, define it as a global and then you can access it from scittle

will try out some of those options. Thx for info