Error in Figwheel - can it be fixed?

[FrancisKing]

Hello. I’ve found an odd problem in learning ClojureScript, Windows 10, Figwheel. Can it be fixed, please?

I’ve got Clojure and Leiningen already. I’ve used cljs.jar to manually compile simple ClojureScript - by simple, I mean println and js/alert, the sort of thing you start with.

Now for Figwheel. A simple approach, without changing the default code as supplied:

lein new figwheel test
cd test
lein figwheel

A brief pause occurs. Figwheel says: “Figwheel: Cutting some fruit, just a sec …”, etc. Then an error occurs,

clojure.lang.ExceptionInfo: :bundle-cmd :none failed
{:cmd ["npx.cmd" "webpack" "--mode=development"], :exit-code 1, :stdout "", :stderr "Error: EPERM: operation not permitted, mkdir 'C:\\Users\\Francis'\ncommand not found: webpack\n"}

The web-page is created, but no REPL is produced, the terminal is locked until I press Ctrl-C.

It appears that it is trying to create C:\Users\Francis King\... but Figwheel chokes on the space in my name. Creating a new Figwheel app in a new C:\Users\ClojureScript doesn’t fix this, because it fails with the same error.

[joinr]

No idea why figwheel (which is the older version, newer version/design is called fighwheel-main) is trying to invoke the bundle stuff on a test template. You don’t have webpack installed apparently, and it’s trying to be invoked for some reason. I don’t remember having that problem when I used the original fighweel.

[outrovurt]

There is nothing more frustrating than getting tools up and running when you’re just starting out only to be faced with messages like this.

We can certainly help to diagnose the issue but the best place to ask for it to be fixed, assuming it is indeed broken, would be the issues section of figwheel’s GitHub page, here:

https://github.com/bhauman/figwheel

However as joinr mentioned, you might be better off trying figwheel-main out to see if your issue is still there. From your output, and without seeing for instance your lein project.clj file, it is very difficult to diagnose your issue.

[joinr]

Very odd. It looks like the version of lein-figwheel is injecting this into the :cljsbuild config map in project.clj:

:target :bundle
:bundle-cmd {:none ["npx.cmd" "webpack" "--mode=development"]
             :default ["npx.cmd" "webpack"]}

Which assumes the presence of node.js and webpack (wrongly IMO). The original figwheel template I started with did not do this. If I comment these out (either via ;; or using per-expression comments like #_ #_)

;;:target :bundle
#_ #_ :bundle-cmd {:none ["npx.cmd" "webpack" "--mode=development"]
                   :default ["npx.cmd" "webpack"]}

Then compiling is fine. Yet there’s another problem with the template:

It’s also compiling to a .js file that resources/public/index.html is not expecting. My project is called figtest (identical setup as yours), and the index.html expects the compiled js to be at

<script src="js/compiled/figtest.js" type="text/javascript"></script>

Except the configuration the template sets up puts it at

:output-to "resources/public/js/compiled/out/figtest.js"

So when the page loads it fails to find the resource the index.html is requesting at public/js/figtest.js

One solution here is to make the project.clj conform to the index.html expectations (you could also go the other way and change index.html) by changing the :output-to key:

 :output-to "resources/public/js/compiled/figtest.js"

With that everything loads and I get a cljs repl as expected. This is a notable contrast to my original experimentation with figwheel about 2 years back. My recent work has migrated to figweel-main which has an excellent tutorial, although figwheel is still viable. I think somebody jacked up the figwheel template along the way and maybe it worked on their setup, but it’s busted for others (you and me at least). Definitely worth filing a bug.

To recap, here is the cljsbuild settings I ended up with:

:cljsbuild {:builds
              [{:id "dev"
                :source-paths ["src"]

                ;; The presence of a :figwheel configuration here
                ;; will cause figwheel to inject the figwheel client
                ;; into your build
                :figwheel {:on-jsload "figtest.core/on-js-reload"
                           ;; :open-urls will pop open your application
                           ;; in the default browser once Figwheel has
                           ;; started and compiled your application.
                           ;; Comment this out once it no longer serves you.
                           :open-urls ["http://localhost:3449/index.html"]}

                :compiler {:main figtest.core
                           ;;:target :bundle
                           :asset-path "js/compiled/out"
                           :output-to "resources/public/js/compiled/figtest.js"
                           :output-dir "resources/public/js/compiled/out"
                          #_#_ :bundle-cmd {:none ["npx.cmd" "webpack" "--mode=development"]
                                        :default ["npx.cmd" "webpack"]}
                           :source-map-timestamp true
                           ;; To console.log CLJS data-structures make sure you enable devtools in Chrome
                           ;; https://github.com/binaryage/cljs-devtools
                           :preloads [devtools.preload]}}
               ;; This next build is a compressed minified build for
               ;; production. You can build this with:
               ;; lein cljsbuild once min
               {:id "min"
                :source-paths ["src"]
                :compiler {:output-to "resources/public/js/compiled/figtest.js"
                           :main figtest.core
                           :optimizations :advanced
                           :pretty-print false}}]}

It looks like the “new” version of lein-figwheel (still old compared to figwheel-main) requires a +no-bundle option…ugh, a lot of old tutorials are wrong now. GitHub - bhauman/figwheel-template: A Leinigen template for figwheel

+no-bundle  Generates a project without npm and webpack support.

So if you delete your project folder and start a new one, THIS time with:

lein new figwheel figtest -- +no-bundle

It will work out of the box (I just confirmed).

[joinr]

@FrancisKing looks like Bruce Haumann updated the lein template so this shouldn’t be a problem now:

Assumption of webpack and bundling as default breaks figwheel template

You have to explicitly use the +bundle option to get the behavior, the legacy behavior from the (older) tutorials is the default.