Incompatibility with sass-loader

[macobo]

I was unable to start using HSWP on a larger repo so I did a bit of digging; It seems there's some edge cases where this module and sass-loader in combination cause a crash.

To repro the bug:

• Clone https://github.com/macobo/webpack-starter, open branch minimal-repro
• Checkout branch minimal-repro
• run yarn; yarn start

Expected Behavior

Build succeeds

Actual Behavior

Build fails

Is an error being thrown?

✖ ｢wdm｣: TypeError: Cannot read property 'hash' of undefined
    at updateMd5CacheItem (/home/macobo/backups/2/projects/scratch/webpack-starter/node_modules/hard-source-webpack-plugin/lib/CacheMd5.js:368:66)
    at <anonymous>

(Potentially) related issues

• TypeError: Cannot read property 'hash' of undefined #416
• About mini-css-extract-plugin compatible #481

Notes about the bug

I did a bit of digging;

• Using ExcludeModulePlugin achieves nothing here.
• Error comes from line

  hard-source-webpack-plugin/lib/CacheMd5.js

  Line 368 in aa0383b

  (md5Cache[file] && md5Cache[file].hash !== value.hash)

  , where value is undefined.
• One of the problematic files in repro is bootstrap-sass/assets/stylesheets/bootstrap/mixins/_alerts.scss - I think the issue might be caused by a css file being imported multiple times.
• What seems to be happening is that

  hard-source-webpack-plugin/lib/CacheMd5.js

  Line 391 in aa0383b

  buildingMd5s[file] = building.then(updateMd5CacheItem);

  gets called twice for the same file.
  • The first time building is a promise with a value which is set somewhere around

    hard-source-webpack-plugin/lib/CacheMd5.js

    Lines 402 to 425 in aa0383b

    	fileDependencies.forEach(file => {
    	if (buildingMd5s[file]) {
    	return;
    	}
    	delete unbuildMd5s[file];
    	if (fileMd5s[file]) {
    	buildingMd5s[file] = {
    	// Subtract a small buffer from now for file systems that record
    	// lower precision mtimes.
    	mtime: Date.now() - MD5_TIME_PRECISION_BUFFER,
    	hash: fileMd5s[file],
    	isFile: true,
    	isDirectory: false,
    	};
    	} else {
    	buildingMd5s[file] = md5(file).then(hash => ({
    	mtime: Date.now() - MD5_TIME_PRECISION_BUFFER,
    	hash,
    	isFile: true,
    	isDirectory: false,
    	}));
    	}
    	});

  • The second time around, the promise chain is broken as buildMd5Ops returns nothing -> chaining it causes an error.
• Adding the following check to the top of updateMd5CacheItem fixed issues for me locally:

              if (!value && md5Cache[file]  ) {
                return;
              }

However I feel like I don't have a broader perspective of how HSWP works internally to know if this is the "correct" fix, or if the issue is the module being processed twice or perhaps even in sass-loader.

@mzgoddard, perhaps can you shed some light onto this issue and what a proper fix might look like?

[yee94]

same issue

[threaz]

Same issue :/

[brainz80]

same thing seems to be happening with [email protected]

[IanVS]

Does this problem only happen in watch mode? That's what I was seeing when I was playing around with it, but I'm worried if anyone might be experiencing this when performing a single build.