Incompatibility with css-loader due to its use of createHash

[issacgerges]

• Operating System: MacOS
• Node Version: 20
• NPM Version: 10.5.0
• webpack Version: 5.90.3
• thread-loader Version: 4.0.2

Expected Behavior

thread-loader is compatible with css-loader

Actual Behavior

The following exception is raised at runtime

Cannot read properties of undefined (reading 'util')
    at PoolWorker.fromErrorObj (/some_dir/node_modules/thread-loader/dist/WorkerPool.js:302:12)
    at /some_dir/node_modules/thread-loader/dist/WorkerPool.js:184:29
    at /some_dir/foo/bar/file.less:1:1
    at defaultGetLocalIdent (/some_dir/node_modules/css-loader/dist/utils.js:323:37)

Code

css-loader expects to be able to create hashes via an exposed loader/webpack api. thread-loader doesn't expose these over the processes bridge so hitting this code will always errror.

How Do We Reproduce?

Specifying any of the localIdent configuration options on css-loader and running it in thread-loader should be enough to repro.

Additional questions

I reported this as a bug since it seemed previously compatibility with css-loader was intended. If that's still the case, is there a better way for them to create hashes?

[alexander-akait]

We need to pass util api to to loader context, feel free to send a PR

[alexander-akait]

Like here https://github.com/webpack-contrib/thread-loader/blob/master/src/worker.js#L215

[itsmepetrov]

Any news?

[alexander-akait]

The latest version should work. What problems/errors do you have?

[itsmepetrov]

@alexander-akait I'm already using the latest version, the issue is with monaco-editor:

ERROR in ./node_modules/monaco-editor/esm/vs/editor/editor.main.js
Module build failed (from ./node_modules/thread-loader/dist/cjs.js):
Thread Loader (Worker 0)
this.utils.contextify is not a function

    at stringifyRequest (/Users/itsmepetrov/Documents/Projects/sprut/sprut.web/node_modules/monaco-editor-webpack-plugin/out/loaders/include.js:15:46)
    at /Users/itsmepetrov/Documents/Projects/sprut/sprut.web/node_modules/monaco-editor-webpack-plugin/out/loaders/include.js:23:43
    at Array.map (<anonymous>)
    at Object.pitch (/Users/itsmepetrov/Documents/Projects/sprut/sprut.web/node_modules/monaco-editor-webpack-plugin/out/loaders/include.js:23:16)
 @ ./modules/monaco-editor/index.js 2:0-46 78:20-72 84:18-30 96:20-72
 @ ./plugins/monaco-editor.js 2:0-49 4:16-33 4:35-47
 @ ./core/plugins.ts 16:2-37
 @ ./core/main.ts 12:0-41 38:2-14

webpack 5.97.1 compiled with 1 error in 16172 ms

[alexander-akait]

@itsmepetrov Yeah, I see, we need to improve this place - https://github.com/webpack-contrib/thread-loader/blob/master/src/worker.js#L379, we already export require('webpack').util.contextify, so we need to make the same as for createHash, do you want to send a PR?

[mjames-c]

@alexander-akait even with that fix there's still a problem with this line:

https://github.com/webpack-contrib/css-loader/blob/99eb892bafc0fa037110f559a3987b74ab53cfde/src/utils.js#L374

any suggestions on how to "pass" loaderContext._compilation.getPath to css-loader when it's wrapped by thread-loader?

[alexander-akait]

@mjames-c We need to fix it here, do you want to send a PR?

[mjames-c]

@alexander-akait i'd be happy to send a PR but i'd need some guidance on "polly-filling" loaderContext._compilation.getPath -- getPath() seems to use many webpack internals (such as this.hooks.assetPath.call):

https://github.com/webpack/webpack/blob/703d9acfe7d40b5c4ea5e140d88d4519c31d4659/lib/Compilation.js#L5111-L5119

it's not clear to me how i would be able to replicate this in thread-loader's worker.js

[alexander-akait]

@mjames-c We should do it like this - https://github.com/webpack-contrib/thread-loader/blob/master/src/worker.js#L173