webpacksassloaderwebpack-pluginwebpack-loader

Webpack loader isn't called with sass local imports


I'm working on a webpack loader that should modify the content of a sass file in some way. the issue is that this loader isn't being called except when I import the sass file within JS so

✅ This will trigger a loader call

File.js

import 'file.scss';

❌ This won't trigger the loader

File.scss

@import './file';

does Sass-loader handle those imports internally & is there a way to achieve what I'm trying to do, maybe with plugins?

Note:- the modification should be done while the module is being imported because I'm going to pass a query string like this one

@import './file?doTheModification=true';

Solution

  • It turns out that webpack only handle the first level import(the import within the JS file) and any @import within the sass files is handled within the sass compiler itself but it does use webpack's file resolver module