Skip to content

Modern API importer do not use webpack filesystem cache #1283

@Acanthostega

Description

@Acanthostega

Bug Description

Hello,

when using the modern API, sass-loader in the load method is doing a readFile from the wrapped fs provided by the webpack context in loaderContext.

https://github.com/webpack/sass-loader/blob/main/src/utils.js#L694

loaderContext.fs.readFile(canonicalPath, "utf8", (err, content) => {
            if (err) {
              reject(err);
              return;
            }

            resolve(content);
          });

Behind the scene, webpack is wrapping fs in filesystem cache to avoid reading too much from the disk the resources already loaded. It uses the CacheInputFileSystem from enhanced-resolve lib. Inside this cache, the code wraps/replace the fs methods by a provider doing the same job and looking inside a cache before delegating to the "original" fs if it is not cached already.

https://github.com/webpack/enhanced-resolve/blob/main/lib/CachedInputFileSystem.js#L187

The method providing the wrapper (https://github.com/webpack/enhanced-resolve/blob/main/lib/CachedInputFileSystem.js#L231) checks if an options is provided. If it is the case, the cache is not used because the wrapper cannot ensure a response expected by its user in the from the cache. The check is done in https://github.com/webpack/enhanced-resolve/blob/main/lib/CachedInputFileSystem.js#L246.

Since the "utf8" option is provided in the readFile call of sass-loader, the cache is never used. This can be problematic for plugins like webpack-virtual-modules relying on this cache to emulate the existence of files on webpack, or for system where reading on disks is time consuming.

A solution is to replace the code by:

   loaderContext.fs.readFile(canonicalPath, (err, content) => {
            if (err) {
              reject(err);
              return;
            }

            resolve(content.toString("utf8"));
          });

The cache will be handled correctly, we just need to convert the content to "utf8" (from what I remember).

Feel free to change the category to another thing than "bug" if it is an expected behaviour. Currently for my use case I have a workaround by wrapping sass-loader so it is ok.

Link to Minimal Reproduction and step to reproduce

Last sass-loader version and normal installation with npm install

Expected Behavior

Using the cache of the filesystem existing in webpack.

Actual Behavior

The filesystem cache of webpack is not used.

Environment

Any systems

Is this a regression?

No

Last Working Version

No response

Additional Context

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions