This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2021-09-02
Channels
- # aleph (25)
- # announcements (17)
- # aws (2)
- # babashka (72)
- # beginners (44)
- # calva (6)
- # cider (3)
- # clj-kondo (109)
- # cljfx (1)
- # cljsrn (31)
- # clojure (151)
- # clojure-austin (1)
- # clojure-europe (36)
- # clojure-nl (5)
- # clojure-norway (2)
- # clojure-spec (17)
- # clojure-uk (12)
- # clojurescript (74)
- # cursive (57)
- # data-science (1)
- # datascript (28)
- # datomic (40)
- # depstar (15)
- # gratitude (3)
- # helix (3)
- # introduce-yourself (1)
- # joker (1)
- # kaocha (2)
- # leiningen (2)
- # lsp (70)
- # lumo (2)
- # malli (2)
- # meander (4)
- # off-topic (10)
- # polylith (27)
- # quil (4)
- # re-frame (18)
- # reagent (24)
- # ring (4)
- # rum (1)
- # shadow-cljs (102)
- # sql (2)
- # tools-deps (48)
- # web-security (8)
- # xtdb (5)
hello 馃憢 Do you think this error is caused by shadow-cljs or reagent?
react_devtools_backend.js:2850 Warning: Invalid attribute name: `cljs$lang$protocol_mask$partition0$`
at div
at eval ()
at exports.CustomGallery ()
at f ()
at div
at div
at cmp ()
at div
at div
at div
at div
at cmp ()
the code
(ns quagga.components.dataview.photos.view
(:require
[reagent.core :as reagent]
["react-photoswipe-gallery" :refer (Gallery Item)]))
(defn photos-component
[]
[:div.tab-page.photos-page {:style {:display "block", :overflow-x "scroll"}}
[:div#tab-contentphotos.tab-content
[:f> Gallery
;; {:id "simple-gallery"}
[:div
{:style
{:display "grid"
:gridTemplateColumns "240px 171px 171px"
:gridTemplateRows "114px 114px"
:gridGap 12}}
[:f> Item
{:id "so-first"
:title "Author: Folkert Gorter"
:height "1600"
:width "1600"
:thumbnail
""
:original
""}
(fn [ref open]
(reagent/as-element
[:img
{:src ""
:ref ref
:on-click open
:style {:cursor "pointer"
:objectFit "cover"
:width "100%"
:maxHeight "100%"}}]))]]]]])
Well deserved!
clojure -A:build:test -M -m shadow.cljs.devtools.cli watch app
@thheller this call seems to work but the issue also seems like potentially a different version issue in the CI env where it鈥檚 failingYeah, I鈥檒l check on that!
Can someone remind me how I can wipe state of the node-repl
without restarting everything? There鈥檚 a way to restart the worker process for that but I can鈥檛 remember 馃槄
I had an issue today which was really odd: I was using this library for two components: https://github.com/khmelevskii/emotion-cljs . I was compiling with shadow-cljs in advacned mode several time a day without an issue, and then suddenly without changing the old code, the components started to crash. I know the problem is with emotion styled componenet as I debugged with the --debug
flag.
I tried to write externs, but my skillset is probably quite limited.
Does anyone know what could be the issue?
I will try to set up a minimal example tomorrow if no one has an idea.
I believe "@emotion/styled" is undefined
in advacned mode
The error says "call" from t.call is undefined
where t is emotion/styled.
can't say without seeing code. there is no difference in how JS code is provided in :advanced
since those parts only ever use :simple
t.call is not a function sorry
$emotion$core$create_styled$$ = function($display_name$jscomp$2_result$jscomp$144$$, $component$jscomp$30$$, $options$jscomp$119$$, $styles$$) {
var $wrap$jscomp$2$$ = $APP.$cljs$core$get$$.$cljs$core$IFn$_invoke$arity$2$($options$jscomp$119$$, "wrap")
, $camel_casing_props_QMARK_$$ = $APP.$cljs$core$get$$.$cljs$core$IFn$_invoke$arity$3$($options$jscomp$119$$, "camelCasingProps?", !0)
, $class_name_prop$jscomp$1$$ = $APP.$cljs$core$name$$($APP.$cljs$core$get$$.$cljs$core$IFn$_invoke$arity$3$($options$jscomp$119$$, "classNameProp", "class-name"))
, $wrapper_component$$ = $APP.$cljs$core$not$$($camel_casing_props_QMARK_$$) ? $component$jscomp$30$$ : null != $component$jscomp$30$$.__emotion_base ? $component$jscomp$30$$ : $APP.$cljs$core$_EQ_$$.$cljs$core$IFn$_invoke$arity$2$($APP.$cljs$core$type$$($component$jscomp$30$$), String) ? $emotion$core$create_forwarded_element$cljs$0core$0IFn$0_invoke$0arity$02$$($component$jscomp$30$$, $emotion$core$object__GT_camel_props$$) : $APP.$cljs$core$_EQ_$$.$cljs$core$IFn$_invoke$arity$2$($class_name_prop$jscomp$1$$, "className") ? $component$jscomp$30$$ : $emotion$core$create_forwarded_element$cljs$0core$0IFn$0_invoke$0arity$02$$($component$jscomp$30$$, function($p1__141952_SHARP_$$) {
return $emotion$core$convert_class_name$$.$cljs$core$IFn$_invoke$arity$2$($p1__141952_SHARP_$$, $class_name_prop$jscomp$1$$);
});
$wrapper_component$$.displayName = $display_name$jscomp$2_result$jscomp$144$$;
$display_name$jscomp$2_result$jscomp$144$$ = function() {
function $G__141956$$($props$jscomp$26$$) {
return $APP.$cljs_bean$core$__GT_js$$($styles$$).concat($props$jscomp$26$$.css);
}
var $fexpr__141955$$ = function() {
var $G__141958$$ = $APP.$cljs_bean$core$__GT_js$$($options$jscomp$119$$);
return $emotion$core$styled_component$$.$cljs$core$IFn$_invoke$arity$2$ ? $emotion$core$styled_component$$.$cljs$core$IFn$_invoke$arity$2$($wrapper_component$$, $G__141958$$) : $emotion$core$styled_component$$.call(null, $wrapper_component$$, $G__141958$$);
}();
return $fexpr__141955$$.$cljs$core$IFn$_invoke$arity$1$ ? $fexpr__141955$$.$cljs$core$IFn$_invoke$arity$1$($G__141956$$) : $fexpr__141955$$.call(null, $G__141956$$);
}();
return $APP.$cljs$core$truth_$$($wrap$jscomp$2$$) ? $wrap$jscomp$2$$.$cljs$core$IFn$_invoke$arity$1$ ? $wrap$jscomp$2$$.$cljs$core$IFn$_invoke$arity$1$($display_name$jscomp$2_result$jscomp$144$$) : $wrap$jscomp$2$$.call(null, $display_name$jscomp$2_result$jscomp$144$$) : $display_name$jscomp$2_result$jscomp$144$$;
}
That would be the function that breaks doown on advanced compliation
in particular the expression
return $fexpr__141955$$.$cljs$core$IFn$_invoke$arity$1$ ? $fexpr__141955$$.$cljs$core$IFn$_invoke$arity$1$($G__141956$$) : $fexpr__141955$$.call(null, $G__141956$$);
$fexpr__141955$$.call
Is undefinedWhat I find odd is the component runs fine on debug mode, but not on advanced, and I don't know how I could solve this.
This would be clojurescript function https://github.com/khmelevskii/emotion-cljs/blob/master/src/emotion/core.cljs#L84
only guess is this https://github.com/khmelevskii/emotion-cljs/blob/master/src/emotion/core.cljs#L14
can you show that in the --debug
output? should be the assignment of $emotion$core$styled_component$$
$emotion$core$styled_component$$ = $module$node_modules$$emotion$styled$dist$emotion_styled_browser_cjs$$.default
I took the latest version of both
11.3.0
It is is really odd, because It was working this morning, I did not change anything, and then suddenly it stopped working.
But I will try to make a minimal example tomorrow.
I compile two versions
can be a simple thing as running npm install
and creating a dependency conflict that wasn't there before
separated by a few seconds
and one of the output works and not the other xD
oh well. Let's see.
I鈥檝e got a namespace that defines transit types for some defrecords
and I need these types to be redefined on code reload. So I added the marker to always reload this NS
(ns ^:dev/always mutesync.background.transit-types
(:require ...))
But this namespace is still not be reloaded when I update one of it鈥檚 children. Does :dev/always
mean always reload this NS or something else?It does mean always reload or even recompile. meaning every recompile cycle will recompile and then reload it. you should see it in the browser console
note that reloading defrecords will invalidate all active instances so that might present a problem?
or not invalidate, just new types so not compatible with the previous ones if you ever to (instance? TheRecord ...)
ah you鈥檙e right it does, but my code is throwing an exception before reloading this namespace is possible, because defrecords are incompatible
I鈥檓 wondering if I should just move away from defrecords for this reason
protocols are nice, but i鈥檇 rather have dev code reload be reliable
of course that only solves part of the problem. custom types aren't really hot-reload/REPL friendly too much
so you define and implement your protocols in a separate namespace?
this is one of the reasons my friend @wilkerlucio says we should use maps with lambdas rather than defrecords
what other issues are you aware of with custom types and hot-reload?
oh i see, it鈥檚 the protocol eval causing issues that you鈥檙e talking about
my issues is i end up re-defining the defrecord and then i can no longer serialize it as transit without re-defining the transit writer
thank you for the help
Does shadow-cljs respect :refer-clojure :exclude
?
(ns user
(:refer-clojure :exclude [compile])
)
(defn compile [] 42)
$ npx shadow-cljs watch :main
shadow-cljs - config: .../shadow-cljs.edn
shadow-cljs - starting via "clojure"
WARNING: compile already refers to: #'clojure.core/compile in namespace: user, being replaced by: #'user/compile
@borkdude Hmmm, clj -M --main cljs.main --compile user
gives the same error, so it's not shadow-cljs
https://clojureverse.org/t/how-are-you-styling-your-clojurescript-apps/7946/7 I'm trying to use this to compile my tailwindcss. However the hooks cannot find the babashka class path. I'm not entirely sure how to add dependencies to be used by clj hooks. I did try to find it in the documentation without success.
@fredrik245 babashka.process
is a library which you can probably add to deps.edn
?
ok, im using shadow-cljs
should I add a deps-file too?
sorry I'm quite new to clojure and clojurescript
You could add a deps.edn
like this:
{:deps {babashka/process {:mvn/version "0.0.2"}}}
and in your shadow-cljs.edn
write :deps true
so it picks up on the deps.edn
You will also need the clojure CLI installed, see https://clojure.org/guides/getting_started
i thought that i linked to a particular reply in the link. I successfully added the dependency in shadow-cljs.edn
so it works now
however it doesn't seem to write any output files. so i'm going to look closer at that
but thanks
ah, great
thanks!
hm, still nothing 馃槥
@fredrik245 Could you post your code to a gist or some public repo?
@borkdude I'm going to bed now. I'll do it tomorrow if I can't find a solution in the morning.
you can at least insert some println
s for debugging if those build functions are executed at all. ok goodnight!
yes I did try that but they didn't execute
yes probably, ill look into it tomorrow with a fresh head 馃槃
thanks for the help