Cannot include bootstrap using Shadow-cljs

DrLjotsson · April 19, 2021, 8:29am

My first try to include a javascript npm package failed. I want to use Bootstrap 5 (currently in beta) Download · Bootstrap v5.0

> npm install bootstrap@next

Works fine

(ns test
  (:require ["bootstrap" :as bootstrap]))

Then I start shadow-cljs
> shadow-cljs watch app

but it errors

[:app] Configuring build.
[:app] Compiling ...
[:app] Build failure:
failed to convert sources
{:tag :shadow.build.closure/convert-error, :sources [[:shadow.build.npm/resource "node_modules/@popperjs/core/dist/cjs/popper.js"] [:shadow.build.npm/resource "node_modules/bootstrap/dist/js/bootstrap.js"]]}
ExceptionInfo: failed to convert sources
        shadow.build.closure/convert-sources-simple*/fn--13753 (closure.clj:1968)
        shadow.build.closure/convert-sources-simple* (closure.clj:1955)
        shadow.build.closure/convert-sources-simple* (closure.clj:1833)
        shadow.build.closure/convert-sources-simple (closure.clj:2127)
        shadow.build.closure/convert-sources-simple (closure.clj:2079)
        shadow.build.compiler/maybe-closure-convert (compiler.clj:1169)
        shadow.build.compiler/maybe-closure-convert (compiler.clj:1162)
        shadow.build.compiler/compile-all (compiler.clj:1414)
        shadow.build.compiler/compile-all (compiler.clj:1281)
        shadow.build.api/compile-sources (api.clj:257)
        shadow.build.api/compile-sources (api.clj:249)
        shadow.build/compile (build.clj:442)
        shadow.build/compile (build.clj:432)
        shadow.cljs.devtools.server.worker.impl/build-compile (impl.clj:363)
        shadow.cljs.devtools.server.worker.impl/build-compile (impl.clj:344)
        shadow.cljs.devtools.server.worker.impl/eval17161/fn--17163 (impl.clj:439)
        clojure.lang.MultiFn.invoke (MultiFn.java:234)
        shadow.cljs.devtools.server.util/server-thread/fn--16923/fn--16924/fn--16932 (util.clj:284)
        shadow.cljs.devtools.server.util/server-thread/fn--16923/fn--16924 (util.clj:283)
        shadow.cljs.devtools.server.util/server-thread/fn--16923 (util.clj:256)
        java.lang.Thread.run (Thread.java:832)
Caused by:
RuntimeException: INTERNAL COMPILER ERROR.
Please report this problem.

LET 372 [length: 36] [source_file: node_modules/bootstrap/dist/js/bootstrap.js]
  Node(OBJECT_PATTERN): node_modules/bootstrap/dist/js/bootstrap.js:372:15
      for (let {
  Parent(DESTRUCTURING_LHS): node_modules/bootstrap/dist/js/bootstrap.js:372:15
      for (let {

        com.google.common.base.Preconditions.checkArgument (Preconditions.java:142)
        com.google.javascript.jscomp.Es6RewriteDestructuring.replacePattern (Es6RewriteDestructuring.java:349)
        com.google.javascript.jscomp.Es6RewriteDestructuring.visitPattern (Es6RewriteDestructuring.java:319)
        com.google.javascript.jscomp.Es6RewriteDestructuring.visit (Es6RewriteDestructuring.java:196)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:914)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:910)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:910)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:907)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:907)
        com.google.javascript.jscomp.NodeTraversal.traverseFunction (NodeTraversal.java:953)
        com.google.javascript.jscomp.NodeTraversal.handleFunction (NodeTraversal.java:859)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:885)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:910)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:907)
        com.google.javascript.jscomp.NodeTraversal.traverseFunction (NodeTraversal.java:953)
        com.google.javascript.jscomp.NodeTraversal.handleFunction (NodeTraversal.java:859)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:885)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:907)
        com.google.javascript.jscomp.NodeTraversal.traverseFunction (NodeTraversal.java:953)
        com.google.javascript.jscomp.NodeTraversal.handleFunction (NodeTraversal.java:859)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:885)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:910)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:910)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:907)
        com.google.javascript.jscomp.NodeTraversal.traverseFunction (NodeTraversal.java:953)
        com.google.javascript.jscomp.NodeTraversal.handleFunction (NodeTraversal.java:859)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:885)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:910)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:910)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.handleScript (NodeTraversal.java:847)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:882)
        com.google.javascript.jscomp.NodeTraversal.traverse (NodeTraversal.java:416)
        com.google.javascript.jscomp.NodeTraversal.traverse (NodeTraversal.java:426)
        com.google.javascript.jscomp.TranspilationPasses.processTranspile (TranspilationPasses.java:450)
        com.google.javascript.jscomp.Es6RewriteDestructuring.process (Es6RewriteDestructuring.java:144)
        com.google.javascript.jscomp.PhaseOptimizer$NamedPass.process (PhaseOptimizer.java:317)
        com.google.javascript.jscomp.PhaseOptimizer.process (PhaseOptimizer.java:232)
        com.google.javascript.jscomp.Compiler.check (Compiler.java:1030)
        com.google.javascript.jscomp.Compiler.performChecksAndTranspilation (Compiler.java:828)
        com.google.javascript.jscomp.Compiler.lambda$stage1Passes$0 (Compiler.java:760)
        com.google.javascript.jscomp.CompilerExecutor.runInCompilerThread (CompilerExecutor.java:127)
        com.google.javascript.jscomp.Compiler.runInCompilerThread (Compiler.java:816)
        com.google.javascript.jscomp.Compiler.stage1Passes (Compiler.java:758)
        com.google.javascript.jscomp.Compiler.compile (Compiler.java:675)
        jdk.internal.reflect.NativeMethodAccessorImpl.invoke0 (NativeMethodAccessorImpl.java:-2)
        jdk.internal.reflect.NativeMethodAccessorImpl.invoke (NativeMethodAccessorImpl.java:64)
        jdk.internal.reflect.DelegatingMethodAccessorImpl.invoke (DelegatingMethodAccessorImpl.java:43)
        java.lang.reflect.Method.invoke (Method.java:564)
        clojure.lang.Reflector.invokeMatchingMethod (Reflector.java:167)
        clojure.lang.Reflector.invokeInstanceMethod (Reflector.java:102)
        shadow.build.closure/convert-sources-simple*/fn--13753/fn--13754 (closure.clj:1958)
        shadow.build.closure/convert-sources-simple*/fn--13753 (closure.clj:1956)
        shadow.build.closure/convert-sources-simple* (closure.clj:1955)
        shadow.build.closure/convert-sources-simple* (closure.clj:1833)
        shadow.build.closure/convert-sources-simple (closure.clj:2127)
        shadow.build.closure/convert-sources-simple (closure.clj:2079)
        shadow.build.compiler/maybe-closure-convert (compiler.clj:1169)
        shadow.build.compiler/maybe-closure-convert (compiler.clj:1162)
        shadow.build.compiler/compile-all (compiler.clj:1414)
        shadow.build.compiler/compile-all (compiler.clj:1281)
        shadow.build.api/compile-sources (api.clj:257)
        shadow.build.api/compile-sources (api.clj:249)
        shadow.build/compile (build.clj:442)
        shadow.build/compile (build.clj:432)
        shadow.cljs.devtools.server.worker.impl/build-compile (impl.clj:363)
        shadow.cljs.devtools.server.worker.impl/build-compile (impl.clj:344)
        shadow.cljs.devtools.server.worker.impl/eval17161/fn--17163 (impl.clj:439)
Caused by:
IllegalArgumentException: LET 372 [length: 36] [source_file: node_modules/bootstrap/dist/js/bootstrap.js]
        com.google.common.base.Preconditions.checkArgument (Preconditions.java:142)
        com.google.javascript.jscomp.Es6RewriteDestructuring.replacePattern (Es6RewriteDestructuring.java:349)
        com.google.javascript.jscomp.Es6RewriteDestructuring.visitPattern (Es6RewriteDestructuring.java:319)
        com.google.javascript.jscomp.Es6RewriteDestructuring.visit (Es6RewriteDestructuring.java:196)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:914)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:910)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:910)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:907)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:907)
        com.google.javascript.jscomp.NodeTraversal.traverseFunction (NodeTraversal.java:953)
        com.google.javascript.jscomp.NodeTraversal.handleFunction (NodeTraversal.java:859)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:885)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:910)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:907)
        com.google.javascript.jscomp.NodeTraversal.traverseFunction (NodeTraversal.java:953)
        com.google.javascript.jscomp.NodeTraversal.handleFunction (NodeTraversal.java:859)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:885)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:907)
        com.google.javascript.jscomp.NodeTraversal.traverseFunction (NodeTraversal.java:953)
        com.google.javascript.jscomp.NodeTraversal.handleFunction (NodeTraversal.java:859)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:885)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:910)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:910)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:907)
        com.google.javascript.jscomp.NodeTraversal.traverseFunction (NodeTraversal.java:953)
        com.google.javascript.jscomp.NodeTraversal.handleFunction (NodeTraversal.java:859)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:885)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:910)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:910)
        com.google.javascript.jscomp.NodeTraversal.traverseChildren (NodeTraversal.java:1042)
        com.google.javascript.jscomp.NodeTraversal.handleScript (NodeTraversal.java:847)
        com.google.javascript.jscomp.NodeTraversal.traverseBranch (NodeTraversal.java:882)
        com.google.javascript.jscomp.NodeTraversal.traverse (NodeTraversal.java:416)
        com.google.javascript.jscomp.NodeTraversal.traverse (NodeTraversal.java:426)
        com.google.javascript.jscomp.TranspilationPasses.processTranspile (TranspilationPasses.java:450)
        com.google.javascript.jscomp.Es6RewriteDestructuring.process (Es6RewriteDestructuring.java:144)
        com.google.javascript.jscomp.PhaseOptimizer$NamedPass.process (PhaseOptimizer.java:317)
        com.google.javascript.jscomp.PhaseOptimizer.process (PhaseOptimizer.java:232)
        com.google.javascript.jscomp.Compiler.check (Compiler.java:1030)
        com.google.javascript.jscomp.Compiler.performChecksAndTranspilation (Compiler.java:828)
        com.google.javascript.jscomp.Compiler.lambda$stage1Passes$0 (Compiler.java:760)
        com.google.javascript.jscomp.CompilerExecutor.runInCompilerThread (CompilerExecutor.java:127)
        com.google.javascript.jscomp.Compiler.runInCompilerThread (Compiler.java:816)
        com.google.javascript.jscomp.Compiler.stage1Passes (Compiler.java:758)
        com.google.javascript.jscomp.Compiler.compile (Compiler.java:675)
        jdk.internal.reflect.NativeMethodAccessorImpl.invoke0 (NativeMethodAccessorImpl.java:-2)
        jdk.internal.reflect.NativeMethodAccessorImpl.invoke (NativeMethodAccessorImpl.java:64)
        jdk.internal.reflect.DelegatingMethodAccessorImpl.invoke (DelegatingMethodAccessorImpl.java:43)
        java.lang.reflect.Method.invoke (Method.java:564)
        clojure.lang.Reflector.invokeMatchingMethod (Reflector.java:167)
        clojure.lang.Reflector.invokeInstanceMethod (Reflector.java:102)
        shadow.build.closure/convert-sources-simple*/fn--13753/fn--13754 (closure.clj:1958)
        shadow.build.closure/convert-sources-simple*/fn--13753 (closure.clj:1956)
        shadow.build.closure/convert-sources-simple* (closure.clj:1955)
        shadow.build.closure/convert-sources-simple* (closure.clj:1833)
        shadow.build.closure/convert-sources-simple (closure.clj:2127)
        shadow.build.closure/convert-sources-simple (closure.clj:2079)
        shadow.build.compiler/maybe-closure-convert (compiler.clj:1169)
        shadow.build.compiler/maybe-closure-convert (compiler.clj:1162)
        shadow.build.compiler/compile-all (compiler.clj:1414)
        shadow.build.compiler/compile-all (compiler.clj:1281)
        shadow.build.api/compile-sources (api.clj:257)
        shadow.build.api/compile-sources (api.clj:249)
        shadow.build/compile (build.clj:442)
        shadow.build/compile (build.clj:432)
        shadow.cljs.devtools.server.worker.impl/build-compile (impl.clj:363)
        shadow.cljs.devtools.server.worker.impl/build-compile (impl.clj:344)
        shadow.cljs.devtools.server.worker.impl/eval17161/fn--17163 (impl.clj:439)
```

thheller · April 19, 2021, 3:03pm

Which shadow-cljs version did you try? Seems to work fine for me with 2.12.5.

DrLjotsson · April 19, 2021, 6:10pm

Doesn’t work with 2.12.5. I tried npm install @popperjs/core also but no luck.

My dependencies in package.json look like this

  "dependencies": {
    "@popperjs/core": "^2.9.2",
    "bootstrap": "^5.0.0-beta3",
    "create-react-class": "^15.7.0",
    "highlight.js": "10.7.1",
    "karma": "^5.2.3",
    "karma-chrome-launcher": "^3.1.0",
    "karma-cljs-test": "^0.1.0",
    "react": "^17.0.1",
    "react-dom": "^17.0.1",
    "react-highlight.js": "1.0.7"
  }

thheller · April 19, 2021, 6:20pm

Where is shadow-cljs? Do you use only shadow-cljs.edn or also project.clj/deps.edn?

DrLjotsson · April 19, 2021, 6:34pm

I use project.clj for cljs dependencies. Do I also need to include bootstrap there?

thheller · April 19, 2021, 6:36pm

Try setting :compiler-options {:output-feature-set :es6} in your build config. Maybe there is a bug in the closure compiler somewhere. The error you get is not from shadow-cljs directly.

DrLjotsson · April 20, 2021, 6:23pm

EDIT: It did not work. I hadn’t :required bootstrap when I tried compiling. This is weird since it works for you. Do you have any idea how to further troubleshoot?

thheller · April 20, 2021, 6:54pm

I don’t know.

First guess is dependency conflicts and actually using an older closure-compiler version. Try shadow-cljs clj-repl and then (clojure.java.io/resource "com/google/javascript/jscomp/Compiler.class") That should give you something like

#object[java.net.URL
        0x6efe4c2
        "jar:file:/C:/Users/thheller/.m2/repository/com/google/javascript/closure-compiler-unshaded/v20210302/closure-compiler-unshaded-v20210302.jar!/com/google/javascript/jscomp/Compiler.class"]

Note the v20210302 version. Make sure you have that as well.

DrLjotsson · April 20, 2021, 7:06pm

Yep, I have v20210302 …

thheller · April 20, 2021, 7:08pm

You can try setting up a reproducible repo so we can hunt down the problem and report it to the closure compiler folks. Not much to do from the shadow-cljs side I’m afraid.

DrLjotsson · April 20, 2021, 7:09pm

Ok, thanks!

saskenuba · May 13, 2021, 6:21pm

I also have the same issue but with shadow-cljs 2.13.0, bootstrap 5.0.1 and popper the same, 2.9.2.
Have you found a solution?

DrLjotsson · May 13, 2021, 6:51pm

No, I have not revisited this yet. I’m planning to do a minimal repro but havent’t had the time

system · November 12, 2021, 6:51am

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.