This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2021-01-17
Channels
- # babashka (4)
- # beginners (161)
- # calva (19)
- # cider (13)
- # circleci (16)
- # clj-kondo (7)
- # cljs-dev (3)
- # cljsrn (46)
- # clojure (105)
- # clojure-australia (2)
- # clojure-nl (15)
- # clojurescript (20)
- # conjure (14)
- # core-async (8)
- # cursive (3)
- # datomic (4)
- # figwheel (5)
- # fulcro (22)
- # graalvm (1)
- # hoplon (2)
- # kaocha (3)
- # leiningen (6)
- # malli (5)
- # off-topic (19)
- # re-frame (5)
- # reagent (1)
- # reitit (43)
- # releases (1)
- # reveal (14)
- # rewrite-clj (2)
- # rum (1)
- # shadow-cljs (31)
- # spacemacs (2)
- # sql (6)
- # xtdb (8)
Hello! I'm creating a regaent component which uses hooks (using Popper.js library): https://dpaste.com/6VL9ZMBCQ using Figwheel-main and want to use advanced optimization. React is provided via foreign-libs. When having optimization level higher than whitespace, I'm getting "Invalid hook call" error. How can I tell the exact reason of it? Or how can I prevent (in CLJS) certain functions from being optimized maybe?
Try adding ^js
in front of every new binding, be it in let
or fn
, that stores a JS object whose fields you're getting via interop.
I.e. instead of (defn dropdown-raw [props] ...)
it will be (defn dropdown-raw [^js props] ...)
and so on.
You don't need to do that for stuff like className
because you never try to access its fields, you just pass it around.
@U2FRKM4TW thanks! tried for props
, but didn't help
@U2FRKM4TW well it's mostly just this: https://dpaste.com/5L966STRY
> Hooks can only be called inside of the body of a function component.
Well, this is quite telling. Maybe Reagent has issues with optimizations and its workaround for creating functional components with :>
.
Are you using Reagent 1.0+ by any chance?
BTW no need to @ someone that participates in a thread - we still get notifications. :)
ah good point on @
reagent is 0.10.0
so yes... maybe I can wrap a functional component with classical one (in classical React, haha) and then this will work
I tried js/React.createElement instead of :>
but this didn't help
i.e. also works during development but getting the same error
when compiled
No idea, sorry. You can direct this particular question to #reagent since its maintainers have higher chances of seeing your question there. Or, since it looks like a proper usage according to the documentation, you can just create an issue on Reagent's GitHub.
Yes, no luck even when I rewrite everything in JS
I'll try later to figure out when I have time, comparing output of whitespace and simple versions in minimal case
Don't know if it's relevant, but you can set :pretty-print
and `:pseudo-names` to true in compiler options, that will give you a much more readable and debuggable advanced build.
yes thanks!