webpack-cli 4.3.0 has broken auto bundling

[paulbutcher]

Enabling auto-bundling with webpack-cli 4.3.0 results in the following error:

[Figwheel:SEVERE] Bundling command failed
[webpack-cli] Running multiple commands at the same time is not possible
[webpack-cli] Found commands: 'bundle', './resources/public/cljs-out/main.js'
[webpack-cli] Run 'webpack --help' to see available commands and options

It seems to have been caused by this monster commit with the helpful description of "refactor: code":

https://github.com/webpack/webpack-cli/commit/10fb66ecd46f6d1c83122cc039a274e737834610

I'll see if I can work out what's going on and put a pull request together which addresses it.

[clyfe]

Crosslink: https://github.com/clojure/clojurescript-site/issues/364

[clyfe]

Further links: New webpack-cli docs: https://webpack.js.org/api/cli/ Output config: https://webpack.js.org/configuration/output/

A setup that works:

;; dev.cljs.edn
{:main my.core
 :target :bundle
 :bundle-cmd {:none [:npx-cmd "webpack" "--mode=development"
                     "--entry" :output-to
                     "--output-path" :final-output-dir]
              :default [:npx-cmd "webpack" "--mode=production"
                        "--entry" :output-to
                        "--output-path" :final-output-dir]}}

Note: default output.filename is main.js. Final output is in ./target/public/cljs-out/dev/main.js. Don't confuse it with ./target/public/cljs-out/dev-main.js which is intermediary.

Can be loaded with:

<script src="cljs-out/dev/main.js" type="text/javascript"></script>

[clyfe]

Scrach my last comment, setup not ideal, it bundles like so:

npx webpack --mode=development \
  --entry ./target/public/cljs-out/dev/main.js
  --output-path ./target/public/cljs-out/dev

Seems same file is both input and output.

[clyfe]

This webpack.config.js avoids the override, with the output being bundle.js instead main.js.

module.exports = {
  output: {
    filename: "bundle.js"
  }
};

[bhauman]

Are you using [figwheel-main 0.2.12] because I committed fixes for this as explained in the CHANGES.md.

https://github.com/bhauman/figwheel-main/commit/22d4895ee1cb6c59de595adf6440669b970ab899 https://github.com/bhauman/figwheel-main/commit/c05a544bd7737bbd43c278441f09ce0edc29a16b https://github.com/bhauman/figwheel-main/commit/1da733610a7b67cc7288f7bbdda734066e160b0d

Am I missing something?

I have just successfully started a figwheel project with webpack 4.43.0

[paulbutcher]

@bhauman the bug I reported results from changes to webpack-cli (not webpack) and were committed in December, so it would have been very impressive indeed if you had fixed them in October 😉.

However I've just updated to webpack-cli 4.4.0, and it looks like it now works again, so I guess that they worked out that they had broken things...

[paulbutcher]

Sorry - ignore that last comment - I am an idiot.

I am still seeing the problem with webpack-cli 4.4.0.

[bhauman]

@paulbutcher

So I would need to know more about your set up because, things are working for me on webpack 4.43.0

My build (a new figwheel-main-template build) doesn't have multiple webpack build processes running at the same time.

webpack builds run synchronously in figwheel-main

[paulbutcher]

@bhauman - the problem isn't with webpack. It's with webpack-cli.

I've just confirmed that I get the problem with a project created using the figwheel-main template, specifically:

clj -X:new create :template figwheel-main :name yourname/hello-world :args '["+npm-bundle","--reagent"]'

Edit package.json to change the version of webpack-cli to 4.4.0 and then build with npm install followed by clojure -A:fig:build.

This gives:

[Figwheel:SEVERE] Bundling command failed
[webpack-cli] Running multiple commands at the same time is not possible
[webpack-cli] Found commands: 'build', 'target/public/cljs-out/dev/main.js'
[webpack-cli] Run 'webpack --help' to see available commands and options

[clyfe]

@bhauman figwheel-main/0.2.12 here. Re: https://github.com/bhauman/figwheel-main/commit/c05a544bd7737bbd43c278441f09ce0edc29a16b , here lies the problem. In new webpack cli input must be via --entry & there's no --output-filename.

[bhauman]

Hmmm well I get this failure when I try that.

[Figwheel:SEVERE] Bundling command failed
error: unknown option '--output-filename'
[webpack-cli] Run 'webpack --help' to see available commands and options

This is a bunch of fun.

I'm using figwheel-main 0.2.12.

Wasn't webpack-cli 4.4 created to support webpack 5?

[bhauman]

@clyfe if you use webpack-cli 4.4 with webpack 5 then --output-filename is recognized.

Or if you use webpack-cli 3.3 with webpack 4 then --output-filename is recognized.

But not webpack-cli 4.4 with webpack 4.

Of course this is ridiculous and not something simply solved.

Hopefully after Webpack 5 things will stabilize? Not likely.

[clyfe]

➜  npx webpack --version
webpack 5.18.0
webpack-cli 4.4.0

These are the setup where --output-filename is not recognized for me.

[paulbutcher]

I'm also seeing the same issue with webpack 5.19.0, webpack-cli 4.4.0.

[bhauman]

Oh well darn. Thank you for letting me know. It used to work for webpack 5. Sorry for the resistance on my end. It took a bit of sorting out the first time.

Can you imagine a single set of parameters that will work on the cli across both versions?

Sent from ProtonMail Mobile

On Sat, Jan 30, 2021 at 2:48 AM, clyfe notifications@github.com wrote:

➜ npx webpack --version webpack 5.18.0 webpack-cli 4.4.0

These are the setup where --output-filename is not recognized for me.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or unsubscribe.

[clyfe]

Seems this:

:none [:npx-cmd "webpack" "--mode=development"
                     "--entry" :output-to
                     "--output-path" :final-output-dir
                     "--output-filename" :final-output-filename]

Results in this:

[Figwheel] Bundling: npx webpack --mode=development \
   --entry ./target/public/cljs-out/dev/main.js \
   --output-path ./target/public/cljs-out/dev \
   --output-filename main_bundle.js

And it works, so Figwheel change should be just: adding the "entry" bit "--entry" :output-to.

[bhauman]

This is odd right because --output-filename is right there.

[bhauman]

OK I tested this out and it works in most cases but not in the case where webpack 4 is used with webpack-cli 4, which is hopefully just not going to happen that often.

I deployed a SNAPSHOT [figwheel-main 0.2.13-SNAPSHOT].

@clyfe @paulbutcher please give it a try and see if it fixes your problems.

@paulbutcher I haven't been able to reproduce your error, but it may be related. What platform (os) are you using?

[paulbutcher]

% uname -v
Darwin Kernel Version 20.3.0: Thu Jan 21 00:07:06 PST 2021; root:xnu-7195.81.3~1/RELEASE_X86_64
% java -version 
openjdk version "1.8.0_265"
OpenJDK Runtime Environment (AdoptOpenJDK)(build 1.8.0_265-b01)
OpenJDK 64-Bit Server VM (AdoptOpenJDK)(build 25.265-b01, mixed mode)

[clyfe]

@bhauman 0.2.13-SNAPSHOT fixes it for me.