Unused assets left by code optimization

[MattIPv4]

Bug Description

When using code optimization to drop unused code, assets that were emitted but no longer referenced are still emitted.

Link to Minimal Reproduction and step to reproduce

https://github.com/MattIPv4/webpack-asset-repro

• npm ci
• npm run build
• ls dist/*.png
• for each file.png, cat dist/main.js | grep <file.png>

One png should be referenced in dist/main.js, while the other won't be as it was used by dead code.

Expected Behavior

Assets that are emitted but later made unused by code optimization should be removed from the emitted assets

Actual Behavior

Assets are always emitted even if all references to them are dropped by code optimization

Environment

System:
    OS: macOS 26.1
    CPU: (14) arm64 Apple M4 Pro
    Memory: 97.52 MB / 24.00 GB
  Binaries:
    Node: 22.13.1 - /Users/mattcowley/.local/state/fnm_multishells/85154_1765079840717/bin/node
    npm: 10.9.2 - /Users/mattcowley/.local/state/fnm_multishells/85154_1765079840717/bin/npm
    pnpm: 10.20.0 - /Users/mattcowley/.local/state/fnm_multishells/85154_1765079840717/bin/pnpm
  Browsers:
    Chrome: 142.0.7444.177
    Firefox Developer Edition: 146.0
    Safari: 26.1
    Safari Technology Preview: 26.0
  Packages:
    webpack-cli: ^6.0.1 => 6.0.1

Is this a regression?

None

Last Working Version

No response

Additional Context

No response

[xiaoxiaojx]

You need to add the following line to your package.json file. See more: optimization.sideEffects

+ "sideEffects": false

[MattIPv4]

That worked! ...but I don't understand why? If the import of the image were to be seen as a side effect, why isn't the import itself left in place? All that gets left is a completely unreferenced image asset?

[MattIPv4]

Hm... in the real world it doesn't seem to work though... alveusgg/extension#401 if I pnpm build here, ls build/static/media/ambassadors/*/emote*.png still returns files generated even though they're unused.

[hai-x]

Hm... in the real world it doesn't seem to work though... alveusgg/extension#401 if I pnpm build here, ls build/static/media/ambassadors/*/emote*.png still returns files generated even though they're unused.

https://github.com/alveusgg/data/blob/9370cf4b0d88b69fc917b0aea1054e5eca678a2c/src/ambassadors/images.ts#L846

It looks like you’re unioning all assets into a single map. Since their actual usage is determined at runtime, we can't safely remove them. We can only analyze them statically to remove unused assets.

[hai-x]

That worked! ...but I don't understand why? If the import of the image were to be seen as a side effect, why isn't the import itself left in place? All that gets left is a completely unreferenced image asset?

We can think import the image as side effect effect, so the unused image asset won't exist in the bundle and import statement will be removed too.

[MattIPv4]

I'm not sure I follow though, their usage isn't determined at runtime, their usage is dropped from the bundle, the assets just remain in the bundle unreferenced?

[hai-x]

their usage isn't determined at runtime

Sorry for the confusion. What I meant is that, for alveusgg/data@9370cf4/src/ambassadors/images.ts#L846, the usages of those import bindings of the asset modules cannot be determined at compile-time right now.

Because in optimization.innerGraph (a.k.a. deep scope analysis), we don’t track ObjectPattern (your case: ambassadorEmoteImages and ambassadorBadgeImages mapping to many images) to form the entire usage chain (export -> import). But, I think we can improve it.

their usage is dropped from the bundle

This is actually done by Terser (default minimizer), not webpack itself. You can verify webpack’s raw bundle via optimization.minimize: false.

[MattIPv4]

Ah okay. Does Webpack not give Terser the ability to drop assets when it drops their imports? This still feels like a Webpack issue as Terser is the default minimizer that I haven't configured at all?

[hai-x]

Does Webpack not give Terser the ability to drop assets when it drops their imports?

Yeah. Terser only applies to JavaScript, not to image assets.

This still feels like a Webpack issue as Terser is the default minimizer that I haven't configured at all?

You are right. When you enable optimization.minimize: true (it's enabled by default in production mode), webpack will use it as default minimizer.

[alexander-akait]

@hai-x is this issue resolved?