Fork me on GitHub
Slack Archive

This page is not created by, affiliated with, or supported by Slack Technologies, Inc.

2024-05-10

Channels

#shadow-cljs
<
2024-05-10
>
emil0r07:05:54

Has anyone had any luck running shoelace’s react implementation for shadow-cljs? I’m getting this error at the compilation stage: 

package @shoelace-style/shoelace had exports, but could not resolve ./dist/utilities/base-path
{:package #object[java.io.File 0x4876c3ae "/<dev-path>/node_modules/@shoelace-style/shoelace"], :require-from nil, :rel-require "./dist/utilities/base-path"}
ExceptionInfo: package @shoelace-style/shoelace had exports, but could not resolve ./dist/utilities/base-path
	shadow.build.npm/find-resource-in-package (npm.clj:819)
	shadow.build.npm/find-resource-in-package (npm.clj:800)
	shadow.build.npm/find-resource (npm.clj:939)
	shadow.build.npm/find-resource (npm.clj:863)
	shadow.build.resolve/find-npm-resource (resolve.clj:123)
	shadow.build.resolve/find-npm-resource (resolve.clj:94)
	shadow.build.resolve/fn--11436 (resolve.clj:266)
	shadow.build.resolve/fn--11436 (resolve.clj:233)
	clojure.lang.MultiFn.invoke (MultiFn.java:244)
	shadow.build.resolve/find-resource-for-string (resolve.clj:81)
	shadow.build.resolve/find-resource-for-string (resolve.clj:70)
	shadow.build.resolve/resolve-string-require (resolve.clj:464)
	shadow.build.resolve/resolve-string-require (resolve.clj:447)
	shadow.build.resolve/resolve-require (resolve.clj:700)
	shadow.build.resolve/resolve-require (resolve.clj:693)
	shadow.build.resolve/resolve-deps/fn--11387 (resolve.clj:52)
	clojure.lang.PersistentVector.reduce (PersistentVector.java:343)
	clojure.core/reduce (core.clj:6885)
	clojure.core/reduce (core.clj:6868)
	shadow.cljs.util/reduce-> (util.clj:42)
	shadow.cljs.util/reduce-> (util.clj:41)
	shadow.build.resolve/resolve-deps (resolve.clj:50)
	shadow.build.resolve/resolve-deps (resolve.clj:34)
	shadow.build.resolve/resolve-symbol-require (resolve.clj:687)
	shadow.build.resolve/resolve-symbol-require (resolve.clj:647)
	shadow.build.resolve/resolve-require (resolve.clj:697)
	shadow.build.resolve/resolve-require (resolve.clj:693)
	shadow.build.resolve/resolve-entry (resolve.clj:707)
	shadow.build.resolve/resolve-entry (resolve.clj:706)
	clojure.lang.PersistentVector.reduce (PersistentVector.java:343)
	clojure.core/reduce (core.clj:6885)
	clojure.core/reduce (core.clj:6868)
	shadow.cljs.util/reduce-> (util.clj:42)
	shadow.cljs.util/reduce-> (util.clj:41)
	shadow.build.resolve/resolve-entries (resolve.clj:721)
	shadow.build.resolve/resolve-entries (resolve.clj:712)
	shadow.build.modules/resolve-module/fn--14039 (modules.clj:252)
	shadow.build.modules/resolve-module (modules.clj:248)
	shadow.build.modules/resolve-module (modules.clj:238)
	clojure.lang.PersistentVector.reduce (PersistentVector.java:343)
	clojure.core/reduce (core.clj:6885)
	clojure.core/reduce (core.clj:6868)
	shadow.build.modules/resolve-modules (modules.clj:258)
	shadow.build.modules/resolve-modules (modules.clj:257)
	shadow.build.modules/analyze (modules.clj:312)
	shadow.build.modules/analyze (modules.clj:303)
	shadow.build/resolve (build.clj:459)
	shadow.build/resolve (build.clj:453)
	shadow.build/compile (build.clj:509)
	shadow.build/compile (build.clj:493)
	shadow.cljs.devtools.server.worker.impl/build-compile (impl.clj:368)
	shadow.cljs.devtools.server.worker.impl/build-compile (impl.clj:349)
	shadow.cljs.devtools.server.worker.impl/do-resource-update (impl.clj:540)
	shadow.cljs.devtools.server.worker.impl/do-resource-update (impl.clj:495)
	shadow.cljs.devtools.server.util/server-thread/fn--15405/fn--15406/fn--15414 (util.clj:283)
	shadow.cljs.devtools.server.util/server-thread/fn--15405/fn--15406 (util.clj:282)
	shadow.cljs.devtools.server.util/server-thread/fn--15405 (util.clj:255)
	java.lang.Thread.run (Thread.java:840)

thheller07:05:50

what was your require?

thheller07:05:35

if you tried "@shoelace-style/shoelace/dist/utilities/base-path" then thats the way of the package telling you are not allowed to do that

emil0r07:05:38

[“@shoelace-style/shoelace/dist/utilities/base-path” :refer [setBasePath]]

thheller07:05:40

try [“@shoelace-style/shoelace/dist/utilities/base-path.js” :refer [setBasePath]]

emil0r07:05:45

Does it have anything to do with package.json in @shoelace-style/shoelace?

emil0r07:05:03

Yeah that worked

emil0r07:05:09

Is it do with ts?

thheller07:05:28

yes, "exports" is a bit weird since there is no real "standard" for it. so I guess shadow-cljs is a bit stricter than webpack, since seemingly webpack doesn't even follow its own documented rules ...

emil0r07:05:43

Right. I came across another package that was also ts written with compiled js files. There I had to import via a $default symbol

emil0r07:05:03

Is there any standard for importing/exporting in js/ts land or is it the wild west?

thheller07:05:10

that all has absolutely zero to do with ts

thheller07:05:40

default exports are standard JS ESM feature

emil0r07:05:28

OK. Not following much at all what happens in JS land I’m afraid. This comes in very handy

Pranav Ram12:05:27

Does :module-loader true only work for :target :browser? I'm able to successfully get the lazy loading working with the target browser using uix.core/lazy and shadow.lazy but when I export the same using :target npm-module, I get an error: Uncaught Error: shadow.loader API was called before shadow.loader.init! You are probably calling module loader too early before shadow-cljs got fully initialized. Context: I'm exporting the app written in cljs and using it in a JS project. Development is done with :target browser but that's then packaged as an npm-module to be used in another project.

thheller14:05:59

yes, it is :browser only. also really doesn't make sense to use lazy for :npm-module

Pranav Ram19:05:31

Yeah I thought that might be the case. Is there a recommended approach to lazy load with the target npm-module? Example is that a main function is exported in JS which eventually routes to a path that must be lazy loaded in another module - all done inside the cljs app

Pranav Ram19:05:46

Or perhaps go via the ESM route?

thheller19:05:01

none of that can really be answered simply. It all depends on what or how the npm-module or esm output is consumed

thheller19:05:43

JS style code splitting is basically entirely different to how CLJS code splitting works, so all the lazy loading approaches from that don't really work

thheller19:05:08

ESM might be an option if you can get the JS code to lazy load the chunks

thheller19:05:33

if CLJS is trying to do the lazy loading that will likely not work since the JS tools likely won't recognize it

thheller19:05:33

:npm-module is already setup so that whatever loads the code can be lazy loaded itself

thheller19:05:40

just the CLJS code itself can't

Pranav Ram04:05:53

I see, this then might need rethinking where the app routing is done. For npm-module, a uix/as-react entry point is exported which lets the parent React app just mount the whole CLJS app and takes in all the external context, i18n stuff, etc. Internally reitit views are lazy loaded - working in browser but not in a exported app as you outlined why. Will try a few approaches and report back here. Possibly let the parent manage routing and load the corresponding files. Thanks!

thheller06:05:15

with :esm and just regular dynamic import this might work. although this is all very reliant on how the other stuff is bundled