Webpack with enabled optimization breaks masking
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 40.3k
- Forks
- 7.2k
- PR merge metrics
- No merged PRs in 30d
Description
Version
- Phaser Version: 3.88.2
- Webpack Version: 5.98.0
- Operating system: Windows
Description
Webpack with optimization / minimize enabled breaks masking.
Example Test Code
// Black overlay
const graphics = scene.add.graphics();
graphics.fillStyle(0x000000, 0.8);
graphics.fillRect(0, 0, 800, 600);
// Objects for mask
const data = scene.add.graphics();
data.fillStyle(0x000000);
data.setVisible(false);
// Mask
const mask = data.createGeometryMask();
mask.invertAlpha = true;
// Set mask
graphics.setMask(mask);
// Some kind of loop
loop() {
data.clear();
data.fillRect(100, 100, 200, 200);
}
This code works fine on local production environment, but after running production version via webpack with enabled optimization, whole screen is filled with graphics (0x000000, 0.8) only - mask doesn't work. Disabling optimization fixes the issue:
// webpack.config.js
optimization: {
minimize: false
}
Optimization / minimize: false
Optimization / minimize: true
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the provided Phaser masking example and webpack.config.js, comparing production builds with optimization.minimize set to true and false. Investigate why the geometry mask fails only in the minimized build; done means the supplied mask continues to work with optimization enabled.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, webpack
- Domain
- build-system, game-dev, web-dev
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 42/100