Fork me on GitHub
#shadow-cljs
<
2020-11-23
>
grumplet11:11:37

Sorry if there’s an obvious answer to this, but I’m seeking reassurance that it’s straight forward to configure generation of ES5 code for older browsers using Shadow. I’m pulling in reframe/reagent and a yet to be decided chart library from npm modules.

thheller11:11:26

es5 output is the default but the answer somewhat depends on "how old is the browser"?

thheller11:11:10

ie8 will likely require manual tuning which can be done of course 😉

grumplet11:11:44

I may need to add poilyfills, but IE10 would be sufficient. IE9 would hit even the stuck in the mud hospital IT departments

thheller11:11:33

clojurescript itself will be fine with even ie6. largely depends on the libs you are going to use. some may work some may not

thheller11:11:12

there is basic polyfilling in shadow-cljs which is usually good enough but it really depends on the libs you use

grumplet11:11:40

Great, many thanks. I suppose the unknown for me is whether I will need to postprocess anything outside of the shadow build.

grumplet11:11:05

I’ll suck it and see for a bit.

thheller11:11:02

unfortunately its impossible to give a concrete answer to this. the various degrees of javascript on npm make this too much of an unknown. not all features can be polyfilled or transpiled so if you end up using those you'll not get far. if you only use conservative libraries with "older" JS then everything will likely just work.

grumplet11:11:55

Useful advice - thank you. So, in case you know off the top of your head - I’m using react-bootstrap and recharts at the moment. React-bootstrap is harder to replace, but I could swap recharts with any reasonable chart lib.

grumplet11:11:21

Those are the only major npm dependencies.

thheller12:11:22

sorry, haven't used either of those. bootstrap is widely used so it should be fine.

recholsknauber13:11:05

Hello! Newbie here--what is best practice for organizing/running .clj code in a Shadow app? Does anyone run "shadow-cljs clj-run" programmatically? My specific case involves generating initial HTML files from clj Hiccup, then affecting the resulting DOMs with Reagent.

amorokh14:11:57

How should I handle css files from npm packages, is there anything in shadow-cljs that causes them to be “copied” to my target dir structure as well as the required js-files? I am quite new to this js-world so apologies if there is an obvious solution (like “don’t use shadow for that”)

thheller15:11:22

@ryanknauber shadow-cljs focuses only on CLJS. for CLJ related things I recommend using lein.

👍 3
thheller15:11:59

@amorokh shadow-cljs does not handle CSS. you can use something like postcss to handle css

tony.kay18:11:38

I’m trying to use proxy support to deal with some SSL/CORs debugging locally. I’ve used nginx for this in the past, and when I downgrade to 2.8.110 it does seem to work fine. With the latest 2.11.7 everything connects, it downloads the correct js, but then shadow always shows the red error bar saying I’m running stale js. The configuration is: In shadow-cljs, I’m using

:devtools         {:devtools-url "" 
and I’m using an nginx proxy configured as shown here https://www.nginx.com/blog/websocket-nginx/

tony.kay18:11:37

The SSL stuff all works perfectly fine (my app functions properly), and the shadow websocket does connect

thheller18:11:02

hmm just a guess but does the nginx maybe not pass query parameters to the websocket properly?

tony.kay18:11:25

that is diff between 2.8 and 2.11?

thheller18:11:29

the opened url should have ?server-token=<uuid>

tony.kay18:11:38

I’ll look at logs

thheller18:11:17

well there were other changes but that is one of the ones that'll lead to the stale error

thheller18:11:17

thats the fn handling this. maybe redefine it at the REPL and add some debug tap>

tony.kay18:11:36

Yeah, that was it @thheller. Thanks. I thought I had the rewrite correct. I had:

location /shadow-cljs/ {
        rewrite ^/shadow-cljs/(.*) /$1 break;
        proxy_pass ;
        proxy_http_version 1.1;
        proxy_set_header   Upgrade $http_upgrade;
        proxy_set_header   Connection "Upgrade";
        proxy_set_header   Host $host;
    }
in nginx, and it turns out putting the $1 on the proxy_pass was wrong…changing it to this fixed it:
location /shadow-cljs/ {
        rewrite ^/shadow-cljs/(.*) /$1 break;
        proxy_pass ;
        proxy_http_version 1.1;
        proxy_set_header   Upgrade $http_upgrade;
        proxy_set_header   Connection "Upgrade";
        proxy_set_header   Host $host;
    }

👍 3