How to exclude dirs from sass loader?

[pohlaniacz]

Hi. I have dir like /uploads/ where user store their photos. When running webpack with enableSassLoader() it makes stat through all this files (which take long time). The only solution for now is to set "resolveUrlLoader: false" but I want to use it for simplier paths. So is there any solution to disable /uploads/ dir?

[Lyrkan]

Hi @pohlaniacz,

I think that's related to this issue: #428

Setting the attempts option of the resolve-url-loader to 1 could solve your issue (as explained here) while we update that loader to v3.x.

There is however no easy way to that right now... you have to change the config manually:

const config = Encore.getWebpackConfig();

for (const rule of config.module.rules) {
  if (rule.test && rule.test.toString() === '/\\.s[ac]ss$/') {
    for (const use of rule.oneOf.map(oneOf => oneOf.use)) {
      for (const loader of use) {
        if (loader.loader === 'resolve-url-loader') {
          loader.options.attempts = 1;
        }
      }
    }
  }
}

module.exports = config;

Or after #509 is released:

Encore.configureLoaderRule('sass', rule => {
  for (const use of rule.oneOf.map(oneOf => oneOf.use)) {
    for (const loader of use) {
      if (loader.loader === 'resolve-url-loader') {
        loader.options.attempts = 1;
      }
    }
  }
})

[pohlaniacz]

damn, thanks, works like a charm! FYI, on intel with 12 cores from E5-1650, 4x16gb ram and 2 ssd disk it took more than 15 minutes (I've stopped it after that, so don't know how long should I wait). After your fix it take ~5 seconds ;) Very strange that I can't easily include/exclude dirs or your fix isn't an option. Thanks again!

[Lyrkan]

Wow, I didn't think the difference would be that big, you must have a lot of files.

The loader doesn't provide an include/exclude mechanisme, how it behaves in that version is a bit weird and you can only limit the amount of folders it'll process (through the attempts option).

options.attempts = 1 would probably be a better default value but since it could break some builds I'd rather update the resolve-url-loader to its latest version which removes this magic beahvior.

As for the fix given in my previous answer, it isn't an option simply because we don't have something like Encore.configureResolveUrlLoader(...) (yet). That could change in the future though.

[pohlaniacz]

I'd rather update the resolve-url-loader to its latest version which removes this magic beahvior.

what do you mean? I think I have the latest version of webpack-encore and only way to "fix" this is resolveUrlLoader: false and turn off resolving url() ?

[Lyrkan]

What I meant is that Encore is using a dependency called resolve-url-loader, currently in version 2.x.

This version does some dirty things behind the scene to generate the right paths in your CSS files as described in #428.

There is a more recent 3.x version that uses a cleaner algorithm to determine those paths.

So, instead of adding attempts: 1 to the default options of the resolve-url-loader in Encore (which is what the "fix" above does) it would probably be a better idea to make it use resolve-url-loader 3.x (that's not something that you can do, but something we have to change on our side).

[pohlaniacz]

ah, ok, now it's clear. Anyway, thanks again for help! Best wishes.