Fork me on GitHub
#shadow-cljs
<
2022-12-11
>
zeitstein08:12:38

I'm trying out using https://shadow-cljs.github.io/docs/UsersGuide.html#classpath-js. This compiles and works:

export class Test {
  static foo = "bar";

  static staticMethod() {
    alert(this === Test);
  }
}
But I'm wondering why because > The Closure Compiler is used for processing all JavaScript found on the classpath using its ECMASCRIPT_NEXT language setting. and the https://github.com/google/closure-compiler/issues/2731? I just want to make sure I'll not encounter issues if I go down this path.

thheller09:12:30

just make sure to test with advanced and stuff

thheller09:12:37

no guarantee this works

zeitstein09:12:38

Thanks. Related, your modern/defclass macro doesn't support static fields as well, correct? So would use something like (set! (.-foo Class) "bar")?

thheller09:12:58

I guess yeah

zeitstein09:12:24

shadow-cljs release compiles this without warnings

/**
 * @nocollapse
 */
export class Test {
  static foo = "bar";

  static staticMethod() {
    alert(this === Test);
  }

  baz = "blah";
}
And this works
(js/console.log
  (.staticMethod Test)
  (.-foo Test)
  (.-baz (new Test)))
Is that a sufficient test? I still think this must be wrong somehow 🙂

thheller09:12:13

I would add a second class with the same setup

thheller09:12:20

and see if it survives and handles correctly

thheller09:12:57

also this will likely and up being completely eliminated and inlined by :advanced

thheller09:12:06

so make sure to create something that is not as inlineable

thheller09:12:11

a second class will help with that

thheller09:12:33

dunno how much @nocollapse helps against entire removal

zeitstein09:12:54

@nocollapse was to remove a warning. Actually, without it there was an error at runtime.

zeitstein09:12:20

Copy pasted same class in same file, still works :man-shrugging:

zeitstein10:12:35

I have a TS file with a class (with static props and methods) which extends from an npm package. I converted that file into JS, compiled with release and it still seems to work. I guess I'll proceed 🙂

Hendrik19:12:13

I tried to add chakra-ui to my cljs (based on fulcro template) project. However, I get the following error:

Errors encountered while trying to parse file
  /Users/abcd/projects/abcd/editor/node_modules/@chakra-ui/utils/dist/index.cjs.js
  {:line 999, :column 10, :message "'(' expected"}
When I inspect the mentioned file I see a normal JS class:
// src/pan-event.ts
var PanSession = class {
  history = [];    // this is line 999 <------------------------------------
  startEvent = null;
  lastEvent = null;
  lastEventInfo = null;
  handlers = {};
  removeListeners = noop;
  threshold = 3;
  win;
  constructor(event, handlers, threshold) {
    this.win = getEventWindow(event);
    if (isMultiTouchEvent(event))
I don’t know why this is not compiling. Is this not supported or do I missed some configuration?

thheller19:12:24

can't say. the closure compiler is sometimes a bit picky.

thheller19:12:19

for such huge UI libs its usually best to stay with webpack as described in this post https://code.thheller.com/blog/shadow-cljs/2020/05/08/how-about-webpack-now.html#option-2-js-provider-external

Hendrik19:12:44

Thanks. One further question. If I provide the chakra js via cdn, then I could configure shadow-cljs to resolve to this like this?

:js-options
   {:resolve {"@chakra-ui/react" {:target :global
                       :global "what-to-add-here"}}}
What would I provide for the :global value?

thheller19:12:34

whatever global the lib provides?

Hendrik20:12:00

Ah of course. It is too late in the evening for me. Thanks for your help 🙂