This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2018-02-05
Channels
- # arachne (7)
- # architecture (3)
- # beginners (106)
- # cider (22)
- # clara (2)
- # cljs-dev (14)
- # cljsrn (12)
- # clojure (121)
- # clojure-china (1)
- # clojure-italy (2)
- # clojure-spec (22)
- # clojure-uk (32)
- # clojurescript (38)
- # community-development (45)
- # cursive (15)
- # datascript (6)
- # datomic (12)
- # defnpodcast (2)
- # emacs (8)
- # events (1)
- # fulcro (14)
- # immutant (6)
- # jobs (3)
- # jobs-discuss (6)
- # jobs-rus (3)
- # keechma (4)
- # keyboards (4)
- # leiningen (8)
- # luminus (1)
- # off-topic (91)
- # onyx (13)
- # parinfer (36)
- # re-frame (12)
- # reagent (23)
- # remote-jobs (1)
- # ring-swagger (3)
- # shadow-cljs (57)
- # specter (11)
- # sql (9)
- # uncomplicate (4)
- # vim (2)
- # yada (15)
Hi i have a quick question. Is the preferred/best way to handle a component that takes optional props and children this from the reagent 0.4.0 update docs?
(defn my-div []
(let [this (r/current-component)]
(into [:div.custom (r/props this)]
(r/children this))))
I’m writing some wrappers for a css lib (bulma) so for say the following, I’m going to create a columns
and column
reagent components. so need columns
to handle it’s children, as well as say any extra options (classes) it may take
<div class="columns">
<div class="column">
First column
</div>
<div class="column">
Second column
</div>
<div class="column">
Third column
</div>
<div class="column">
Fourth column
</div>
</div>
I can understand how this is like translating the client = new ApolloClient()
to cljs. But that doesn't import it, does it? (At least I get an error when I run the app: Uncaught ReferenceError: ApolloClient is not defined at ...
)
(this is about how to use existing react modules in reagent)
Another trial, close, but not there yet: there this react module: https://github.com/apollographql/react-apollo I'd like to add to my reagent (re-frame) project. I basically need a way to import the react-apollo module and have it imported properly into my ns.
Step 1: add it to project.clj
:
....
:cljsbuild {:builds {:app {...
:compiler {...
:npm-deps {:react-apollo "2.0.4"
:apollo-client "2.2.2"}
:install-deps true
....
Step 2: add it to your namespace:
(ns ...
(:require [....
[apollo-client]
...]))
Step 3: define the client as a reagent component:
(def apollo-client (reagent/adapt-react-class (appolo-client/ApolloClient.)))
I get stuck at step 3 (I think): while compiling:
WARNING: No such namespace: appolo-client, could not locate appolo_client.cljs, appolo_client.cljc, or JavaScript source providing "appolo-client" at line 29 src/cljs/ui_app/core.cljs
WARNING: Use of undeclared Var appolo-client/ApolloClient at line 29 src/cljs/ui_app/core.cljs
WARNING: No such namespace: appolo-client, could not locate appolo_client.cljs, appolo_client.cljc, or JavaScript source providing "appolo-client" at line 29 src/cljs/ui_app/core.cljs
WARNING: Use of undeclared Var appolo-client/ApolloClient at line 29 src/cljs/ui_app/core.cljs
According to: https://anmonteiro.com/2017/03/requiring-node-js-modules-from-clojurescript-namespaces/ :
> It’s interesting to note how left-pad is both a namespace and a function.but it's not in this case.
or at least, the ns is not found... so, where am I missing something?
checking https://github.com/apollographql/apollo-client/blob/master/packages/apollo-client/src/index.ts it exports ApolloClient:
// export the client as both default and named
export { ApolloClient };
export default ApolloClient;
but requiring the ApolloClient
doesn't work either> (require '[ApolloClient])
---- Could not Analyze <cljs form> line:1 column:1 ----
No such namespace: ApolloClient, could not locate ApolloClient.cljs, ApolloClient.cljc, or JavaScript source providing "ApolloClient" at line 1 <cljs repl>
1 (require '[ApolloClient])
^---
---- Analysis Error ----
which brings me to the question: how to require
and use existing react-modules (npm) in reagent?
(the left-pad example works, btw, so it must be something with the namespaces/js exports?)
I haven't read through everything you have written, in a hurry, but to answer this last question you either:
1. Check cljsjs is see if someone has done Applo already http://cljsjs.github.io/ OR
2. you'll have to (1) <script> in the necessary minified js
while also being sure to (2) create and use the necessary externs
.
Not nearly enough detail ... but gotta go
1. cljsjs - no, checked it. Also, packages seem to be outdated pretty often (no offense to anyone). I'd prefer a straight forward direct import, but I do use cljsjs (since there doesn't seem to be a good way :p)
2. hmmm, tried that before, never got it working properly. Apparently, there should be an easy way (like the example with the left-pad
, that one works). I just don't get why some npm packages seem to work the way it's described in https://anmonteiro.com/2017/03/requiring-node-js-modules-from-clojurescript-namespaces/ and some, apparently, don't.
Have an ask in the #clojurescript channel. This is now more a general problem, than a reagent specific problem
like in the apollo-client repo, there's this structure:
-- packages
|
-- ...
-- apollo-client
agreed, sorry.
There's likely to be npm-knowledgeable people in that channel (that's the skill you now need access to)
hi, i have a general question, i’m writing a reagent wrapper lib, for a css framework. usually i just write my components as ‘normal’ reagent functions. But in this case, i of course end up needing to flexibly pass args that vary (modifier classes, etc). In this case, does it make sense to just follow the more generic [props & children]
approach?