This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2020-10-26
Channels
- # announcements (7)
- # aws (1)
- # babashka (15)
- # beginners (144)
- # calva (8)
- # chlorine-clover (15)
- # clara (4)
- # clojure (65)
- # clojure-europe (131)
- # clojure-france (1)
- # clojure-nl (6)
- # clojure-nlp (3)
- # clojure-spec (10)
- # clojure-uk (52)
- # clojuredesign-podcast (2)
- # clojurescript (28)
- # cryogen (1)
- # datomic (17)
- # events (2)
- # figwheel-main (2)
- # fulcro (8)
- # hugsql (2)
- # jackdaw (4)
- # jobs (1)
- # leiningen (8)
- # lumo (1)
- # malli (4)
- # off-topic (23)
- # parinfer (3)
- # pathom (3)
- # pedestal (5)
- # re-frame (9)
- # reagent (26)
- # reitit (13)
- # reveal (25)
- # shadow-cljs (45)
- # spacemacs (7)
- # sql (7)
- # tools-deps (40)
- # vrac (2)
- # xtdb (22)
For JS libraries (e.g. https://github.com/Microsoft/monaco-editor) that offer multiple approaches to modules (AMD, ESM + Webpack, ESM + Parcel, …), which one should I go with if I’m using shadow-cljs?
IIRC the last time I tried to use that package myself it tried to do a bunch of dynamic import
which shadow-cljs doesn't support
looks like it still does that crap when it even requires custom webpack config/plugin to use https://github.com/microsoft/monaco-editor/blob/master/docs/integrate-esm.md
you can just use the AMD version and manually embed it in the page and not in the actual CLJS build
Phew, that was quick 🙂
Anyway great advice, thanks… any reason to pick AMD over webpack or vice versa?
Actually I think I’ll just bite thee bullet and set up webpack as described in https://code.thheller.com/blog/shadow-cljs/2020/05/08/how-about-webpack-now.html
if you just want an editor in a html page try codemirror. that one works and is used by many people.
I did try codemirror already actually, but I like the look of monaco so I want to see if I can get that one working instead
I didn’t try it with shadow-cljs yet, but okay. I’ll see if I can get ESM to work with shadow-cljs and fall back to whichever of ASM and webpack I can get working first 😉
Alright.. out of curiousity, why would the worker stuff be tricky? Because of something the workers do?
ok nevermind it is not going to work. I did a quick test and it is importing css. so webpack it is
Okay then 🙂
BTW, you wouldn’t happen to have a recommended way of running webpack --watch and shadow-cljs watch? Curious if there’s a way to have both without running two terminal windows
I have used https://github.com/strongloop/node-foreman, https://github.com/mysticatea/npm-run-all and a few others in the past
Got it
So I got AMD working, but I decided to see if I could go with https://www.npmjs.com/package/@monaco-editor/react instead to save myself from having to write a bunch of glue code. However, when I try to load that, shadow-cljs gives me the following error: browser.cljs:38 Failed to load my-project/monaco.cljs TypeError: Cannot redefine property: DiffEditor
. Do you think there’s a way around this, or should I give up? 🙂
(sorry for all these questions BTW, I’m new to the JS ecosystem and it’s absolutely bewildering to me)
I’m doing (ns my-project.monaco (:require ["@monaco-editor/react" :refer [Editor]]))
and then nothing else
it seems to use AMD: https://www.npmjs.com/package/@monaco-editor/react#config
Perhaps there’s some sort of conflict happening with some other JS lib I’ve previously run? I’ll see if I can reproduce from a clean slate
just write the 5 lines to do that yourself and save the headache of making that lib work
Okay 🙂
how can I troubleshoot shadow giving me a stale output error? I see my build running in the web console, with warnings. But when I connect to my app shdow-cljs gives me a stale output error, though the app runs. I cleared my js, and the .shadow-cljs folder and restarted my watch but it still says stale output even though it was forced to recompile everything from complete scratch.