Clojurians Log v2

Thought I’d figured it out, but no luck, just giving me a list of npm modules to install and installing them doesn’t appear to create a valid build…

^{:final-output-to "resources/public/js/compiled/app.js"
  :open-url            false
  :watch-dirs          ["test" "src"]
  :css-dirs            ["resources/public/css"]}
{:main example.core
 :target :bundle
 :bundle-cmd {:default ["npx" "webpack" "--mode=production" :output-to "-o" :final-output-to]}
 :output-dir           "resources/public/js/compiled/"
 :asset-path           "/js/compiled/"
 :source-map-timestamp true
 :closure-defines {goog.DEBUG false}}

@folcon with the bundle target the bundler cant process the output-to if its not in output-dir

figwheel does add that message to save you

closure-defines needs `

:closure-defines {cljs.core/*global* "window"}}

for advanced @folcon

@folcon the docs are not complete up to date yet, I’m still working on it

Hey! Great to hear from you! I actually tried this example repo from you https://github.com/PEZ/fresh-figwheel-main. I choose jack-in and selected :fig and :build, but then calva just stays in “trying to connect” mode.

Oh, I know what is going wrong. Let me add a thing to the README about it. brb

There, README updated. You'll see what tripped you up, I hope. I'm sorry about the inconvenience!

I would love to understand more of the source code, maybe you can point me in the direction where this is handled? And I don’t quite understand what role nrepl and piggieback plays.

I'm not an expert on nrepl, nor piggieback. But anyway, nrepl is a protocol between a REPL client and the Clojure REPL. Calva is a REPL client, using this protocol. The nREPL needs to be started in the running Clojure application in order for Calva's nREPL client to have anything to connect to, The clojure command has a main argument that can start the nREPL server, if it exists in the dependencies. The command also has arguments to add dependencies that are not present in the deps.edn file. This means that with the right command line Calva gets what it needs, This command line will do the trick in the case of that templated project:

clojure -Sdeps '{:deps {nrepl {:mvn/version "0.6.0"} cider/cider-nrepl {:mvn/version "0.23.0"} clj-kondo {:mvn/version "2020.04.05"} cider/piggieback {:mvn/version "0.4.2"} com.bhauman/figwheel-main {:mvn/version "0.2.3"}}}'  -m nrepl.cmdline --middleware "[cider.nrepl/cider-middleware cider.piggieback/wrap-cljs-repl]" 

If you look in the VS Code terminal where the jack-in is launched you will see where I copied it from. 😃 It's the -m nrepl.cmdline that starts the nrepl server. The cider.nrepl/cider-middleware middleware is for enriching the nrepl server with some ops that Calva uses. cider.piggieback/wrap-cljs-repl provides the piggieback cljs-repl.

piggiback is a way to start a ClojureScript REPL from a Clojure REPL.

It is used by Calva (by proxy of figwheel main) to start its repl. You can see the Clojure code used here: https://github.com/BetterThanTomorrow/calva/blob/master/src/nrepl/connectSequence.ts#L142

(`%BUILDS%` is where the start builds you select at jack in end up.)

I've tried to explain a bit in depth about Calva Jack-in here: https://calva.io/jack-in-guide/

One more thing. The reason why the :fig alias doesn't work with Calva is that Calva can't figure out if the alias has the dependencies and main arguments needed. So in the presence of an alias used Calva builds the commandline using the alias, but doesn't add the -m nrepl.cmdline and middleware. In that project the fig alias looks like so:

:aliases {:fig {:extra-deps
                  {com.bhauman/rebel-readline-cljs {:mvn/version "0.1.4"}
                   com.bhauman/figwheel-main {:mvn/version "0.1.9"}}
                 :extra-paths ["target" "test"]}

And since -m nrepl.cmdline is not there, it won't work. The things that Calva expects should happen doesn't happen and no connection for you.

I hope I answered at least some of your questions? At least maybe I gave you some starters for understanding this in more depth. 😃

Oh, thanks!

Thank you for all you’ve done on it so far, it’s tons better =)…

Still seems to be failing on some things?

[Figwheel:SEVERE] Bundling command failed
Hash: f3ef2058a04f2aae0cef
Version: webpack 4.43.0
Time: 45456ms
Built at: 05/30/2020 10:37:27 AM
 1 asset
Entrypoint main = app.js
 [0] (webpack)/buildin/global.js 472 bytes {0} [built]
[31] ./resources/public/js/compiled/main.js 1.14 MiB {0} [built]
[49] (webpack)/buildin/module.js 497 bytes {0} [built]
[55] util (ignored) 15 bytes {0} [built]
[57] util (ignored) 15 bytes {0} [built]
    + 61 hidden modules

ERROR in ./node_modules/xmlhttprequest/lib/XMLHttpRequest.js
Module not found: Error: Can't resolve 'child_process' in '/<project-path>/node_modules/xmlhttprequest/lib'
 @ ./node_modules/xmlhttprequest/lib/XMLHttpRequest.js 15:12-36
 @ ./resources/public/js/compiled/main.js

ERROR in ./node_modules/xmlhttprequest/lib/XMLHttpRequest.js
Module not found: Error: Can't resolve 'fs' in '/<project-path>/node_modules/xmlhttprequest/lib'
 @ ./node_modules/xmlhttprequest/lib/XMLHttpRequest.js 16:9-22
 @ ./resources/public/js/compiled/main.js
Syntax error (ExceptionInfo) compiling at (/private/var/folders/xl/rkkw077j4xxf827wn82mcp_c0000gn/T/form-init5928516375636353650.clj:1:125).
Bundling command failed
Hash: f3ef2058a04f2aae0cef
Version: webpack 4.43.0
Time: 45456ms
Built at: 05/30/2020 10:37:27 AM
 1 asset
Entrypoint main = app.js
 [0] (webpack)/buildin/global.js 472 bytes {0} [built]
[31] ./resources/public/js/compiled/main.js 1.14 MiB {0} [built]
[49] (webpack)/buildin/module.js 497 bytes {0} [built]
[55] util (ignored) 15 bytes {0} [built]
[57] util (ignored) 15 bytes {0} [built]
    + 61 hidden modules

ERROR in ./node_modules/xmlhttprequest/lib/XMLHttpRequest.js
Module not found: Error: Can't resolve 'child_process' in '/<project-path>/node_modules/xmlhttprequest/lib'
 @ ./node_modules/xmlhttprequest/lib/XMLHttpRequest.js 15:12-36
 @ ./resources/public/js/compiled/main.js

ERROR in ./node_modules/xmlhttprequest/lib/XMLHttpRequest.js
Module not found: Error: Can't resolve 'fs' in '/<project-path>/node_modules/xmlhttprequest/lib'
 @ ./node_modules/xmlhttprequest/lib/XMLHttpRequest.js 16:9-22
 @ ./resources/public/js/compiled/main.js

^{:final-output-to "resources/public/js/compiled/app.js"
  :open-url            false
  :watch-dirs          ["test" "src"]
  :css-dirs            ["resources/public/css"]}
{:main example.core
 :target :bundle
 :bundle-cmd {:default ["npx" "webpack" "--mode=production" :output-to "-o" :final-output-to]}
 :output-dir           "resources/public/js/compiled/"
 :asset-path           "/js/compiled/"
 :source-map-timestamp true
 :devcards             true
 :closure-defines {cljs.core/*global* "window"
                   goog.DEBUG false}}

Omg, thank you for your help!! So helpful 😊👍

I love calva btw, has been using it for a while and it has been great!

Awesome. And welcome!

Just tried your test repo again and it worked flawlessly following your new instructions 😄

@folcon so is your development build working?

because the bundling isn’t working based on either the way you are requiring “fs” or “child_process”, or some other reason it can’t resolve them

Somewhat? I got it working at one point, but then tried to get prod working and so now I suspect it’s not in a great state. I preferably want one consistent way to produce an output that given an index.html file produces: in dev, a file (which in my case is app.js) and a folder which I can just stick on s3. in prod a single app.js which I can also stick on s3 with it’s index.html… I previously achieved this with different dev.cljs.edn and min.cljs.edn to produce a consistent output =)… I don’t believe I require those libs at all, a library I use might…

But at one point the dev certainly was =)…

I’d try to get back to that state, you may need to blow away node_modules and start again

I’ve been fiddling with the cljs version to see if that’s the problem, not quite certain which version I need… (currently on 1.10.764)

you should use 1.10.773

I’ve removed all the node modules for the moment =)…

Ahh ok that’s probably a good start…

Right, I’ll be able to try this again in about 30 mins, will let you know how I get on =)…

but also you can just use the :auto-bundle :webpack feature

and change :output-to the directory you want

just to get started

oh but that doesn’t add mode production to the cli

I’ll have to fix that

yeah reach out if you need help

Has someone tried figwheel-main 0.2.6 with vim-fireplace? I can connect with Piggieback but when trying to evaluate I'm getting Not supported: class figwheel.repl.FigwheelReplEnv$fn__16105.

I'm also seeing this previously fixed problem reappear: https://github.com/bhauman/figwheel-main/issues/145

hmmm, I don’t think there was a regression here

oh but the latest clojurescript stopped passing output-to to the repl

I tried both the older clojurescript 1.10.597 and 1.10.773 with figwheel-main 0.2.6, in both cases the issue #145 seems to be present

OK yeah I’m looking at it, I don’t see the :output-dir in there hmmm

Yes this change got reverted!

I don’t know how, but …

OK I reverted it on purpose because it was causing the repl to hang on error somehow

@jkr.sw found the problem should have a fix out shortly

Excellent, thank you

@jkr.sw just deployed changes to 0.2.7-SNAPSHOT

0.2.7-SNAPSHOT also has :bundle-freq which can either be :once , :always or :smart which checks for changes to output-to or npm_deps.js

:bundle-once is deprecated as :bundle-freq is just a better name

I’d love to deploy 0.2.7 tomorrow as its the end of month 1 of the Clojurists Together Quarter

Just tried 0.2.7-SNAPSHOT, both the problems I had before are fixed 👍

Evaluations are showing #object[cider.piggieback.UnknownTaggedLiteral ...] when returning eg. atom or a function, normally there should be eg.`#object[clojure.lang.Atom ...]`, but I guess that might not be a problem in figwheel-main

Never mind, found that documented in Piggieback: https://github.com/nrepl/piggieback/blob/master/README.md#pretty-printing

Something came up, just got back and trying it now. - ok, killed my node_modules, and deleted all the existing js stuff and now rebuilding dev. - dev works it seems, trying min. - nope min still fails… @bhauman Not sure what you mean by :auto-bundle :webpack? Do you mean setting :target :bundle? - Trying again with min, I’ll add all the deps it says are missing, but dev didn’t complain at all… - Nope just fails with the same message as before.

@jkr.sw thanks for reporting back!

Hey, @bhauman =)… I’ve updated the prior thread with the last attempts, and I’m around for a bit if you want me to test stuff.

@folcon here’s what I would try

first you don’t need an asset-path because its all bundled in one file

@folcon so yeah its strange that you are experiencing this

wait are you using :optimizations :advanced?

@folcon for bundling a single artifact you need to use either advanced or simple :optimizations

Also skip :asset-path

yeah so the main thing for the final bundling you need CLJS to output a single file

Cool, give me a few minutes and I’ll report back what’s happening =)…