css-loader 6.3.0 → 6.6.0

package/README.md

@@ -872,6 +872,36 @@ module.exports = {
 };
 ```
 
+##### `hashStrategy`
+
+Type: `'resource-path-and-local-name' | 'minimal-subset'`
+Default: `'resource-path-and-local-name'`
+
+Should local name be used when computing the hash.
+
+- `'resource-path-and-local-name'` Both resource path and local name are used when hashing. Each identifier in a module gets its own hash digest, always.
+- `'minimal-subset'` Auto detect if identifier names can be omitted from hashing. Use this value to optimize the output for better GZIP or Brotli compression.
+
+**webpack.config.js**
+
+```js
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /\.css$/i,
+        loader: "css-loader",
+        options: {
+          modules: {
+            hashStrategy: "minimal-subset",
+          },
+        },
+      },
+    ],
+  },
+};
+```
+
 ##### `localIdentRegExp`
 
 Type: `String|RegExp`
@@ -1446,7 +1476,7 @@ For `production` builds it's recommended to extract the CSS from your bundle bei
 This can be achieved by using the [mini-css-extract-plugin](https://github.com/webpack-contrib/mini-css-extract-plugin), because it creates separate css files.
 For `development` mode (including `webpack-dev-server`) you can use [style-loader](https://github.com/webpack-contrib/style-loader), because it injects CSS into the DOM using multiple <style></style> and works faster.
 
-> i Do not use together `style-loader` and `mini-css-extract-plugin`.
+> i Do not use `style-loader` and `mini-css-extract-plugin` together.
 
 **webpack.config.js**
 

package/dist/index.js

@@ -49,9 +49,18 @@ async function loader(content, map, meta) {
 
   const importPluginImports = [];
   const importPluginApi = [];
+  let isSupportAbsoluteURL = false; // TODO enable by default in the next major release
+
+  if (this._compilation && this._compilation.options && this._compilation.options.experiments && this._compilation.options.experiments.buildHttp) {
+    isSupportAbsoluteURL = true;
+  }
+
+  const isSupportDataURL = options.esModule && Boolean("fsStartTime" in this._compiler);
 
   if ((0, _utils.shouldUseImportPlugin)(options)) {
     plugins.push((0, _plugins.importParser)({
+      isSupportAbsoluteURL: false,
+      isSupportDataURL: false,
       isCSSStyleSheet: options.exportType === "css-style-sheet",
       loaderContext: this,
       imports: importPluginImports,
@@ -65,22 +74,21 @@ async function loader(content, map, meta) {
 
   if ((0, _utils.shouldUseURLPlugin)(options)) {
     const needToResolveURL = !options.esModule;
-    const isSupportDataURLInNewURL = options.esModule && Boolean("fsStartTime" in this._compiler);
     plugins.push((0, _plugins.urlParser)({
+      isSupportAbsoluteURL,
+      isSupportDataURL,
       imports: urlPluginImports,
       replacements,
       context: this.context,
       rootContext: this.rootContext,
       filter: (0, _utils.getFilter)(options.url.filter, this.resourcePath),
-      needToResolveURL,
       resolver: needToResolveURL ? this.getResolve({
         mainFiles: [],
         extensions: []
       }) : // eslint-disable-next-line no-undefined
       undefined,
-      urlHandler: url => (0, _utils.stringifyRequest)(this, url),
-      // Support data urls as input in new URL added in webpack@5.38.0
-      isSupportDataURLInNewURL
+      urlHandler: url => (0, _utils.stringifyRequest)(this, url) // Support data urls as input in new URL added in webpack@5.38.0
+
     }));
   }
 

package/dist/options.json

@@ -114,6 +114,11 @@
               "link": "https://github.com/webpack-contrib/css-loader#localidenthashdigestlength",
               "type": "number"
             },
+            "hashStrategy": {
+              "description": "Allows to specify should localName be used when computing the hash.",
+              "link": "https://github.com/webpack-contrib/css-loader#hashstrategy",
+              "enum": ["resource-path-and-local-name", "minimal-subset"]
+            },
             "localIdentRegExp": {
               "description": "Allows to specify custom RegExp for local ident name.",
               "link": "https://github.com/webpack-contrib/css-loader#localidentregexp",

package/dist/plugins/index.js

@@ -3,16 +3,16 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "importParser", {
+Object.defineProperty(exports, "icssParser", {
   enumerable: true,
   get: function () {
-    return _postcssImportParser.default;
+    return _postcssIcssParser.default;
   }
 });
-Object.defineProperty(exports, "icssParser", {
+Object.defineProperty(exports, "importParser", {
   enumerable: true,
   get: function () {
-    return _postcssIcssParser.default;
+    return _postcssImportParser.default;
   }
 });
 Object.defineProperty(exports, "urlParser", {

package/dist/plugins/postcss-import-parser.js

@@ -11,7 +11,7 @@ var _utils = require("../utils");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function parseNode(atRule, key) {
+function parseNode(atRule, key, options) {
   // Convert only top-level @import
   if (atRule.parent.type !== "root") {
     return;
@@ -74,10 +74,13 @@ function parseNode(atRule, key) {
   }
 
   url = (0, _utils.normalizeUrl)(url, isStringValue);
-  const isRequestable = (0, _utils.isUrlRequestable)(url);
+  const {
+    requestable,
+    needResolve
+  } = (0, _utils.isURLRequestable)(url, options);
   let prefix;
 
-  if (isRequestable) {
+  if (requestable && needResolve) {
     const queryParts = url.split("!");
 
     if (queryParts.length > 1) {
@@ -139,7 +142,8 @@ function parseNode(atRule, key) {
     layer,
     supports,
     media,
-    isRequestable
+    requestable,
+    needResolve
   };
 }
 
@@ -157,10 +161,17 @@ const plugin = (options = {}) => {
               return;
             }
 
+            const {
+              isSupportDataURL,
+              isSupportAbsoluteURL
+            } = options;
             let parsedAtRule;
 
             try {
-              parsedAtRule = parseNode(atRule, "params", result);
+              parsedAtRule = parseNode(atRule, "params", {
+                isSupportAbsoluteURL,
+                isSupportDataURL
+              });
             } catch (error) {
               result.warn(error.message, {
                 node: error.node
@@ -195,7 +206,8 @@ const plugin = (options = {}) => {
           const resolvedAtRules = await Promise.all(parsedAtRules.map(async parsedAtRule => {
             const {
               atRule,
-              isRequestable,
+              requestable,
+              needResolve,
               prefix,
               url,
               layer,
@@ -211,7 +223,7 @@ const plugin = (options = {}) => {
               }
             }
 
-            if (isRequestable) {
+            if (needResolve) {
               const request = (0, _utils.requestify)(url, loaderContext.rootContext);
               const resolvedUrl = await (0, _utils.resolveRequests)(resolver, loaderContext.context, [...new Set([request, url])]);
 
@@ -232,7 +244,7 @@ const plugin = (options = {}) => {
                 supports,
                 media,
                 prefix,
-                isRequestable
+                requestable
               };
             }
 
@@ -244,7 +256,7 @@ const plugin = (options = {}) => {
               supports,
               media,
               prefix,
-              isRequestable
+              requestable
             };
           }));
           const urlToNameMap = new Map();
@@ -259,13 +271,13 @@ const plugin = (options = {}) => {
 
             const {
               url,
-              isRequestable,
+              requestable,
               layer,
               supports,
               media
             } = resolvedAtRule;
 
-            if (!isRequestable) {
+            if (!requestable) {
               options.api.push({
                 url,
                 layer,

package/dist/plugins/postcss-url-parser.js

@@ -49,32 +49,21 @@ function getWebpackIgnoreCommentValue(index, nodes, inBetween) {
   return matched && matched[2] === "true";
 }
 
-function shouldHandleURL(url, declaration, result, isSupportDataURLInNewURL) {
+function shouldHandleURL(url, declaration, result, options) {
   if (url.length === 0) {
     result.warn(`Unable to find uri in '${declaration.toString()}'`, {
       node: declaration
     });
-    return false;
+    return {
+      requestable: false,
+      needResolve: false
+    };
   }
 
-  if ((0, _utils.isDataUrl)(url) && isSupportDataURLInNewURL) {
-    try {
-      decodeURIComponent(url);
-    } catch (ignoreError) {
-      return false;
-    }
-
-    return true;
-  }
-
-  if (!(0, _utils.isUrlRequestable)(url)) {
-    return false;
-  }
-
-  return true;
+  return (0, _utils.isURLRequestable)(url, options);
 }
 
-function parseDeclaration(declaration, key, result, isSupportDataURLInNewURL) {
+function parseDeclaration(declaration, key, result, options) {
   if (!needParseDeclaration.test(declaration[key])) {
     return;
   }
@@ -126,9 +115,13 @@ function parseDeclaration(declaration, key, result, isSupportDataURLInNewURL) {
       } = valueNode;
       const isStringValue = nodes.length !== 0 && nodes[0].type === "string";
       let url = isStringValue ? nodes[0].value : _postcssValueParser.default.stringify(nodes);
-      url = (0, _utils.normalizeUrl)(url, isStringValue); // Do not traverse inside `url`
+      url = (0, _utils.normalizeUrl)(url, isStringValue);
+      const {
+        requestable,
+        needResolve
+      } = shouldHandleURL(url, declaration, result, options); // Do not traverse inside `url`
 
-      if (!shouldHandleURL(url, declaration, result, isSupportDataURLInNewURL)) {
+      if (!requestable) {
         // eslint-disable-next-line consistent-return
         return false;
       }
@@ -147,7 +140,8 @@ function parseDeclaration(declaration, key, result, isSupportDataURLInNewURL) {
         node: getNodeFromUrlFunc(valueNode),
         prefix,
         url,
-        needQuotes: false
+        needQuotes: false,
+        needResolve
       }); // eslint-disable-next-line consistent-return
 
       return false;
@@ -176,9 +170,13 @@ function parseDeclaration(declaration, key, result, isSupportDataURLInNewURL) {
           } = nNode;
           const isStringValue = nodes.length !== 0 && nodes[0].type === "string";
           let url = isStringValue ? nodes[0].value : _postcssValueParser.default.stringify(nodes);
-          url = (0, _utils.normalizeUrl)(url, isStringValue); // Do not traverse inside `url`
+          url = (0, _utils.normalizeUrl)(url, isStringValue);
+          const {
+            requestable,
+            needResolve
+          } = shouldHandleURL(url, declaration, result, options); // Do not traverse inside `url`
 
-          if (!shouldHandleURL(url, declaration, result, isSupportDataURLInNewURL)) {
+          if (!requestable) {
             // eslint-disable-next-line consistent-return
             return false;
           }
@@ -197,7 +195,8 @@ function parseDeclaration(declaration, key, result, isSupportDataURLInNewURL) {
             node: getNodeFromUrlFunc(nNode),
             prefix,
             url,
-            needQuotes: false
+            needQuotes: false,
+            needResolve
           });
         } else if (type === "string") {
           needIgnore = getWebpackIgnoreCommentValue(innerIndex, valueNode.nodes);
@@ -212,9 +211,13 @@ function parseDeclaration(declaration, key, result, isSupportDataURLInNewURL) {
             continue;
           }
 
-          let url = (0, _utils.normalizeUrl)(value, true); // Do not traverse inside `url`
+          let url = (0, _utils.normalizeUrl)(value, true);
+          const {
+            requestable,
+            needResolve
+          } = shouldHandleURL(url, declaration, result, options); // Do not traverse inside `url`
 
-          if (!shouldHandleURL(url, declaration, result, isSupportDataURLInNewURL)) {
+          if (!requestable) {
             // eslint-disable-next-line consistent-return
             return false;
           }
@@ -233,7 +236,8 @@ function parseDeclaration(declaration, key, result, isSupportDataURLInNewURL) {
             node: nNode,
             prefix,
             url,
-            needQuotes: true
+            needQuotes: true,
+            needResolve
           });
         }
       } // Do not traverse inside `image-set`
@@ -256,9 +260,13 @@ const plugin = (options = {}) => {
       return {
         Declaration(declaration) {
           const {
-            isSupportDataURLInNewURL
+            isSupportDataURL,
+            isSupportAbsoluteURL
           } = options;
-          const parsedURL = parseDeclaration(declaration, "value", result, isSupportDataURLInNewURL);
+          const parsedURL = parseDeclaration(declaration, "value", result, {
+            isSupportDataURL,
+            isSupportAbsoluteURL
+          });
 
           if (!parsedURL) {
             return;
@@ -274,7 +282,8 @@ const plugin = (options = {}) => {
 
           const resolvedDeclarations = await Promise.all(parsedDeclarations.map(async parsedDeclaration => {
             const {
-              url
+              url,
+              needResolve
             } = parsedDeclaration;
 
             if (options.filter) {
@@ -286,7 +295,7 @@ const plugin = (options = {}) => {
               }
             }
 
-            if ((0, _utils.isDataUrl)(url)) {
+            if (!needResolve) {
               // eslint-disable-next-line consistent-return
               return parsedDeclaration;
             }
@@ -296,12 +305,12 @@ const plugin = (options = {}) => {
             let hash = query ? "?" : "";
             hash += hashOrQuery ? `#${hashOrQuery}` : "";
             const {
-              needToResolveURL,
+              resolver,
               rootContext
             } = options;
-            const request = (0, _utils.requestify)(pathname, rootContext, needToResolveURL);
+            const request = (0, _utils.requestify)(pathname, rootContext, Boolean(resolver));
 
-            if (!needToResolveURL) {
+            if (!resolver) {
               // eslint-disable-next-line consistent-return
               return { ...parsedDeclaration,
                 url: request,
@@ -309,20 +318,16 @@ const plugin = (options = {}) => {
               };
             }
 
-            const {
-              resolver,
-              context
-            } = options;
-            const resolvedUrl = await (0, _utils.resolveRequests)(resolver, context, [...new Set([request, url])]);
+            const resolvedURL = await (0, _utils.resolveRequests)(resolver, options.context, [...new Set([request, url])]);
 
-            if (!resolvedUrl) {
+            if (!resolvedURL) {
               // eslint-disable-next-line consistent-return
               return;
             } // eslint-disable-next-line consistent-return
 
 
             return { ...parsedDeclaration,
-              url: resolvedUrl,
+              url: resolvedURL,
               hash
             };
           }));
@@ -361,7 +366,7 @@ const plugin = (options = {}) => {
               options.imports.push({
                 type: "url",
                 importName,
-                url: options.needToResolveURL ? options.urlHandler(newUrl) : JSON.stringify(newUrl),
+                url: options.resolver ? options.urlHandler(newUrl) : JSON.stringify(newUrl),
                 index
               });
             }

package/dist/runtime/api.js

@@ -51,8 +51,8 @@ module.exports = function (cssWithMappingToString) {
     var alreadyImportedModules = {};
 
     if (dedupe) {
-      for (var _i = 0; _i < this.length; _i++) {
-        var id = this[_i][0];
+      for (var k = 0; k < this.length; k++) {
+        var id = this[k][0];
 
         if (id != null) {
           alreadyImportedModules[id] = true;
@@ -60,8 +60,8 @@ module.exports = function (cssWithMappingToString) {
       }
     }
 
-    for (var _i2 = 0; _i2 < modules.length; _i2++) {
-      var item = [].concat(modules[_i2]);
+    for (var _k = 0; _k < modules.length; _k++) {
+      var item = [].concat(modules[_k]);
 
       if (dedupe && alreadyImportedModules[item[0]]) {
         continue;

package/dist/utils.js

@@ -3,29 +3,29 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.normalizeOptions = normalizeOptions;
-exports.shouldUseModulesPlugins = shouldUseModulesPlugins;
-exports.shouldUseImportPlugin = shouldUseImportPlugin;
-exports.shouldUseURLPlugin = shouldUseURLPlugin;
-exports.shouldUseIcssPlugin = shouldUseIcssPlugin;
-exports.normalizeUrl = normalizeUrl;
-exports.requestify = requestify;
+exports.WEBPACK_IGNORE_COMMENT_REGEXP = void 0;
+exports.camelCase = camelCase;
+exports.combineRequests = combineRequests;
+exports.getExportCode = getExportCode;
 exports.getFilter = getFilter;
+exports.getImportCode = getImportCode;
+exports.getModuleCode = getModuleCode;
 exports.getModulesOptions = getModulesOptions;
 exports.getModulesPlugins = getModulesPlugins;
-exports.normalizeSourceMap = normalizeSourceMap;
 exports.getPreRequester = getPreRequester;
-exports.getImportCode = getImportCode;
-exports.getModuleCode = getModuleCode;
-exports.getExportCode = getExportCode;
+exports.isDataUrl = isDataUrl;
+exports.isURLRequestable = isURLRequestable;
+exports.normalizeOptions = normalizeOptions;
+exports.normalizeSourceMap = normalizeSourceMap;
+exports.normalizeUrl = normalizeUrl;
+exports.requestify = requestify;
 exports.resolveRequests = resolveRequests;
-exports.isUrlRequestable = isUrlRequestable;
+exports.shouldUseIcssPlugin = shouldUseIcssPlugin;
+exports.shouldUseImportPlugin = shouldUseImportPlugin;
+exports.shouldUseModulesPlugins = shouldUseModulesPlugins;
+exports.shouldUseURLPlugin = shouldUseURLPlugin;
 exports.sort = sort;
-exports.combineRequests = combineRequests;
-exports.camelCase = camelCase;
 exports.stringifyRequest = stringifyRequest;
-exports.isDataUrl = isDataUrl;
-exports.WEBPACK_IGNORE_COMMENT_REGEXP = void 0;
 
 var _url = require("url");
 
@@ -55,9 +55,14 @@ function isAbsolutePath(str) {
 
 function isRelativePath(str) {
   return matchRelativePath.test(str);
-}
+} // TODO simplify for the next major release
+
 
 function stringifyRequest(loaderContext, request) {
+  if (typeof loaderContext.utils !== "undefined" && typeof loaderContext.utils.contextify === "function") {
+    return JSON.stringify(loaderContext.utils.contextify(loaderContext.context || loaderContext.rootContext, request));
+  }
+
   const splitted = request.split("!");
   const {
     context
@@ -313,22 +318,17 @@ function escapeLocalIdent(localident) {
 }
 
 function defaultGetLocalIdent(loaderContext, localIdentName, localName, options) {
-  let relativeMatchResource = "";
   const {
-    context
+    context,
+    hashSalt,
+    hashStrategy
   } = options;
   const {
     resourcePath
-  } = loaderContext; // eslint-disable-next-line no-underscore-dangle
-
-  if (loaderContext._module && loaderContext._module.matchResource) {
-    relativeMatchResource = `${normalizePath( // eslint-disable-next-line no-underscore-dangle
-    _path.default.relative(context, loaderContext._module.matchResource))}\x00`;
-  }
-
+  } = loaderContext;
   const relativeResourcePath = normalizePath(_path.default.relative(context, resourcePath)); // eslint-disable-next-line no-param-reassign
 
-  options.content = `${relativeMatchResource}${relativeResourcePath}\x00${localName}`;
+  options.content = hashStrategy === "minimal-subset" && /\[local\]/.test(localIdentName) ? relativeResourcePath : `${relativeResourcePath}\x00${localName}`;
   let {
     hashFunction,
     hashDigest,
@@ -345,21 +345,30 @@ function defaultGetLocalIdent(loaderContext, localIdentName, localName, options)
     // eslint-disable-next-line no-param-reassign
 
     localIdentName = localIdentName.replace(/\[(?:([^:\]]+):)?(?:hash|contenthash|fullhash)(?::([a-z]+\d*))?(?::(\d+))?\]/gi, () => hashName === "fullhash" ? "[fullhash]" : "[contenthash]");
-  } // eslint-disable-next-line no-underscore-dangle
+  }
 
+  let localIdentHash = "";
 
-  const hash = loaderContext._compiler.webpack.util.createHash(hashFunction);
+  for (let tier = 0; localIdentHash.length < hashDigestLength; tier++) {
+    // TODO remove this in the next major release
+    const hash = loaderContext.utils && typeof loaderContext.utils.createHash === "function" ? loaderContext.utils.createHash(hashFunction) : // eslint-disable-next-line no-underscore-dangle
+    loaderContext._compiler.webpack.util.createHash(hashFunction);
 
-  const {
-    hashSalt
-  } = options;
+    if (hashSalt) {
+      hash.update(hashSalt);
+    }
 
-  if (hashSalt) {
-    hash.update(hashSalt);
-  }
+    const tierSalt = Buffer.allocUnsafe(4);
+    tierSalt.writeUInt32LE(tier);
+    hash.update(tierSalt); // TODO: bug in webpack with unicode characters with strings
+
+    hash.update(Buffer.from(options.content, "utf8"));
+    localIdentHash = (localIdentHash + hash.digest(hashDigest) // Remove all leading digits
+    ).replace(/^\d+/, "") // Replace all slashes with underscores (same as in base64url)
+    .replace(/\//g, "_") // Remove everything that is not an alphanumeric or underscore
+    .replace(/[^A-Za-z0-9_]+/g, "").slice(0, hashDigestLength);
+  } // TODO need improve on webpack side, we should allow to pass hash/contentHash without chunk property, also `data` for `getPath` should be looks good without chunk property
 
-  hash.update(options.content);
-  const localIdentHash = hash.digest(hashDigest).slice(0, hashDigestLength).replace(/[/+]/g, "_").replace(/^\d/g, "_"); // TODO need improve on webpack side, we should allow to pass hash/contentHash without chunk property, also `data` for `getPath` should be looks good without chunk property
 
   const ext = _path.default.extname(resourcePath);
 
@@ -689,7 +698,8 @@ function getModulesPlugins(options, loaderContext) {
     localIdentHashFunction,
     localIdentHashDigest,
     localIdentHashDigestLength,
-    localIdentRegExp
+    localIdentRegExp,
+    hashStrategy
   } = options.modules;
   let plugins = [];
 
@@ -707,6 +717,7 @@ function getModulesPlugins(options, loaderContext) {
             hashFunction: localIdentHashFunction,
             hashDigest: localIdentHashDigest,
             hashDigestLength: localIdentHashDigestLength,
+            hashStrategy,
             regExp: localIdentRegExp
           });
         } // A null/undefined value signals that we should invoke the default
@@ -720,6 +731,7 @@ function getModulesPlugins(options, loaderContext) {
             hashFunction: localIdentHashFunction,
             hashDigest: localIdentHashDigest,
             hashDigestLength: localIdentHashDigestLength,
+            hashStrategy,
             regExp: localIdentRegExp
           });
           return escapeLocalIdent(localIdent).replace(/\\\[local\\]/gi, exportName);
@@ -843,6 +855,13 @@ function normalizeSourceMapForRuntime(map, loaderContext) {
 
   if (resultMap) {
     delete resultMap.file;
+    /* eslint-disable no-underscore-dangle */
+
+    if (loaderContext._compilation && loaderContext._compilation.options && loaderContext._compilation.options.devtool && loaderContext._compilation.options.devtool.includes("nosources")) {
+      /* eslint-enable no-underscore-dangle */
+      delete resultMap.sourcesContent;
+    }
+
     resultMap.sourceRoot = "";
     resultMap.sources = resultMap.sources.map(source => {
       // Non-standard syntax from `postcss`
@@ -901,7 +920,13 @@ function getModuleCode(result, api, replacements, options, loaderContext) {
     return "";
   }
 
-  const sourceMapValue = options.sourceMap ? `,${normalizeSourceMapForRuntime(result.map, loaderContext)}` : "";
+  let sourceMapValue = "";
+
+  if (options.sourceMap) {
+    const sourceMap = result.map;
+    sourceMapValue = `,${normalizeSourceMapForRuntime(sourceMap, loaderContext)}`;
+  }
+
   let code = JSON.stringify(result.css);
   let beforeCode = `var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(${options.sourceMap ? "___CSS_LOADER_API_SOURCEMAP_IMPORT___" : "___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___"});\n`;
 
@@ -1060,28 +1085,67 @@ async function resolveRequests(resolve, context, possibleRequests) {
   });
 }
 
-function isUrlRequestable(url) {
+function isURLRequestable(url, options = {}) {
   // Protocol-relative URLs
   if (/^\/\//.test(url)) {
-    return false;
+    return {
+      requestable: false,
+      needResolve: false
+    };
+  } // `#` URLs
+
+
+  if (/^#/.test(url)) {
+    return {
+      requestable: false,
+      needResolve: false
+    };
+  } // Data URI
+
+
+  if (isDataUrl(url) && options.isSupportDataURL) {
+    try {
+      decodeURIComponent(url);
+    } catch (ignoreError) {
+      return {
+        requestable: false,
+        needResolve: false
+      };
+    }
+
+    return {
+      requestable: true,
+      needResolve: false
+    };
   } // `file:` protocol
 
 
   if (/^file:/i.test(url)) {
-    return true;
+    return {
+      requestable: true,
+      needResolve: true
+    };
   } // Absolute URLs
 
 
   if (/^[a-z][a-z0-9+.-]*:/i.test(url) && !NATIVE_WIN32_PATH.test(url)) {
-    return false;
-  } // `#` URLs
-
+    if (options.isSupportAbsoluteURL && /^https?:/i.test(url)) {
+      return {
+        requestable: true,
+        needResolve: false
+      };
+    }
 
-  if (/^#/.test(url)) {
-    return false;
+    return {
+      requestable: false,
+      needResolve: false
+    };
   }
 
-  return true;
+  return {
+    requestable: true,
+    needResolve: true
+  };
 }
 
 function sort(a, b) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "css-loader",
-  "version": "6.3.0",
+  "version": "6.6.0",
   "description": "css loader module for webpack",
   "license": "MIT",
   "repository": "webpack-contrib/css-loader",
@@ -43,50 +43,50 @@
   },
   "dependencies": {
     "icss-utils": "^5.1.0",
-    "postcss": "^8.2.15",
+    "postcss": "^8.4.5",
     "postcss-modules-extract-imports": "^3.0.0",
     "postcss-modules-local-by-default": "^4.0.0",
     "postcss-modules-scope": "^3.0.0",
     "postcss-modules-values": "^4.0.0",
-    "postcss-value-parser": "^4.1.0",
+    "postcss-value-parser": "^4.2.0",
     "semver": "^7.3.5"
   },
   "devDependencies": {
-    "@babel/cli": "^7.14.5",
-    "@babel/core": "^7.14.6",
-    "@babel/preset-env": "^7.14.7",
-    "@commitlint/cli": "^13.1.0",
-    "@commitlint/config-conventional": "^13.1.0",
+    "@babel/cli": "^7.16.8",
+    "@babel/core": "^7.16.12",
+    "@babel/preset-env": "^7.16.11",
+    "@commitlint/cli": "^16.1.0",
+    "@commitlint/config-conventional": "^16.0.0",
     "@webpack-contrib/eslint-config-webpack": "^3.0.0",
-    "babel-jest": "^27.0.6",
+    "babel-jest": "^27.4.6",
     "cross-env": "^7.0.3",
     "del": "^6.0.0",
     "del-cli": "^4.0.1",
     "es-check": "^6.0.0",
-    "eslint": "^7.30.0",
+    "eslint": "^8.7.0",
     "eslint-config-prettier": "^8.3.0",
-    "eslint-plugin-import": "^2.23.4",
+    "eslint-plugin-import": "^2.25.4",
     "file-loader": "^6.2.0",
     "husky": "^7.0.1",
-    "jest": "^27.0.6",
+    "jest": "^27.4.7",
     "less": "^4.1.1",
     "less-loader": "^10.0.1",
-    "lint-staged": "^11.0.1",
-    "memfs": "^3.2.2",
-    "mini-css-extract-plugin": "^2.1.0",
+    "lint-staged": "^12.3.2",
+    "memfs": "^3.4.1",
+    "mini-css-extract-plugin": "^2.5.3",
     "npm-run-all": "^4.1.5",
-    "postcss-loader": "^6.1.1",
-    "postcss-preset-env": "^6.7.0",
-    "prettier": "^2.3.2",
-    "sass": "^1.35.2",
-    "sass-loader": "^12.1.0",
+    "postcss-loader": "^6.2.1",
+    "postcss-preset-env": "^7.2.3",
+    "prettier": "^2.5.1",
+    "sass": "^1.49.0",
+    "sass-loader": "^12.4.0",
     "standard-version": "^9.3.1",
     "strip-ansi": "^6.0.0",
     "style-loader": "^3.1.0",
-    "stylus": "^0.55.0",
+    "stylus": "^0.56.0",
     "stylus-loader": "^6.1.0",
     "url-loader": "^4.1.1",
-    "webpack": "^5.45.1"
+    "webpack": "^5.67.0"
   },
   "keywords": [
     "webpack",