This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2022-04-09
Channels
- # announcements (3)
- # babashka (1)
- # beginners (66)
- # clj-kondo (2)
- # cljdoc (46)
- # cljs-dev (7)
- # clojure (16)
- # clojure-australia (2)
- # clojure-china (1)
- # clojure-europe (3)
- # clojure-hk (1)
- # clojure-japan (1)
- # clojure-korea (1)
- # clojure-my (1)
- # clojure-sg (1)
- # clojure-taiwan (1)
- # clojurescript (4)
- # community-development (53)
- # conjure (6)
- # css (7)
- # cursive (6)
- # datascript (1)
- # datomic (5)
- # exercism (5)
- # graalvm (12)
- # helix (8)
- # jobs-rus (1)
- # kaocha (1)
- # lsp (19)
- # nrepl (1)
- # overtone (2)
- # pedestal (1)
- # polylith (2)
- # portal (2)
- # react (25)
- # reagent (1)
- # shadow-cljs (7)
- # spacemacs (8)
- # vim (9)
I'm hoping I can ask for a bit of help understanding hooks-based code https://github.com/rgm/experiments/pull/68/files
The problem I'm having is: when I uncomment here I get the dreaded "Warning: Invalid hook call." https://github.com/rgm/experiments/pull/68/files#diff-34c367a936adf6884a6c5338eea0e8b6aa654a7bb049ff4825555cd0afd12939R15 ... I can use the hooks calls in the helix/cljs just fine but the one over in my JSX is blowing up.
The test button component is just a counter using setState
here https://github.com/rgm/experiments/pull/68/files#diff-fc5d90800d83feb1853cecf16dd05a9427a39046f1166d0ff690622bd2e23104R7 ... the "RUNNING BUTTON" log message doesn't appear at all in the browser console.
(It's not impossible—in fact, quite likely—that I've mis-packaged the npm in some way).
Not at my desk so here's some lazy help on the go:
1. I think you're supposed to use the $ macro for the imported components but idk
2. You don't have to js#
the props map
3. Honestly it might be the weird way you wrapped the js Button component in cljs
4. Hopefully that wasn't too useless!
Thanks, I figured it out... my issue was in the npm packaging/linking to a local dir.
As best as I can understand it, npm i ../path/to/local/package creates a symlink, and <..insert things I don't understand in the middle ...>, which leads to two copies of React, leading the useState hook call in the JSX component to blow up when invoked from the cljs. I diagnosed it with the advice in http://reactjs.org/warnings/invalid-hook-call-warning.html#duplicate-react, and eventually figured out it was the non-production-style npm install that linked the JSX component into the cljs project.
The trick was to use npx install-local ../mylib
from the /myapp
(ie. shadow) side.
sigh ... yet again the error message was telling me exactly what was wrong, I just wasn't studied up enough to understand it.
rayat’s comments are still correct but sounds like you fixed your core issue
Thanks, I figured it out... my issue was in the npm packaging/linking to a local dir.
As best as I can understand it, npm i ../path/to/local/package creates a symlink, and <..insert things I don't understand in the middle ...>, which leads to two copies of React, leading the useState hook call in the JSX component to blow up when invoked from the cljs. I diagnosed it with the advice in http://reactjs.org/warnings/invalid-hook-call-warning.html#duplicate-react, and eventually figured out it was the non-production-style npm install that linked the JSX component into the cljs project.
The trick was to use npx install-local ../mylib
from the /myapp
(ie. shadow) side.