Svg-sprite-loader: Cannot find module 'webpack/lib/RuleSet'

[DrGor]

Do you want to request a feature, report a bug or ask a question?
bug
What is the current behavior?
throws an error: Cannot find module 'webpack/lib/RuleSet'
What is the expected behavior?
works with webpack 5

Please tell us about your environment:

• Node.js version: ?
• webpack version: 5
• svg-sprite-loader version: v4.1.6
• OS type & version: ?

Other information (e.g. detailed explanation, stacktraces, related issues, suggestions how to fix, links for us to have context, eg. stackoverflow, gitter, etc)
Please see https://github.com/webpack/webpack/issues/9802#issuecomment-541468003 and https://github.com/vuejs/vue-loader/issues/1427#issuecomment-533610604
In a nutshell, webpack needs to be added as a dependency.

[Lyrkan]

@DrGor

Please see webpack/webpack#9802 (comment) and vuejs/vue-loader#1427 (comment)
In a nutshell, webpack needs to be added as a dependency.

As noted in my comment in the Webpack thread the problem comes from the removal of RuleSet in Webpack 5 (https://github.com/webpack/webpack/pull/9138).

The solution from that vue-loader issue only applies to Webpack <= 4 in which this class was present (it didn't really make sense to use the loader without Webpack anyway...).

What I meant by "vue-loader has the same issue" is that its code will also have to be changed in order to make it work with Webpack 5.

[DrGor]

@Lyrkan

I have no experience with vue-loader, but I can see they still use RuleSet, see it here https://github.com/vuejs/vue-loader/blob/master/lib/plugin.js

and their library is marked as compatible with Webpack 5, see here: https://github.com/vuejs/vue-loader/blob/master/package.json#L37

and I also can't find any open issues around RuleSet in their repo.
So I am confused :)

[Lyrkan]

I have no experience with vue-loader, but I can see they still use RuleSet, see it here vuejs/vue-loader:lib/plugin.js@master

Yep, that's exactly what I was referring to :)

and their library is marked as compatible with Webpack 5, see here: vuejs/vue-loader:package.json@master#L37

That line was changed in january, before the RuleSet class was removed.

and I also can't find any open issues around RuleSet in their repo.

I couldn't find one either, so there you go: https://github.com/vuejs/vue-loader/issues/1599

[mayako21126]

here is my pr add support for webpack5 to add support for webpack5。Hope it helps you guys

[dkrnl]

webpack 5 released https://webpack.js.org/blog/2020-10-10-webpack-5-release/

[zhongzhong0505]

any updates?

[izaika]

Found a workaround without forking or publishing packages.
In the root of your project directory (where your package.json file situated) create two files:

// funcMock.js
module.exports = () => {}

// prebuild.sh

#!/bin/bash

cat ./funcMock.js > ./node_modules/svg-sprite-loader/lib/utils/get-matched-rule.js

Make sure prebuild.sh has enough permissions to be executed (sudo chmod 777 ./prebuild.sh)

change your build (or start) script in package json so it executes sh file before compiling by webpack: ./prebuild.sh && webpack --config webpack.config.js

And it works

[glen-84]

Fixed in v5.1.1 (?).

/cc @d3x42.