css-loader 4.3.0 → 5.0.0

package/dist/utils.js

@@ -75,6 +75,13 @@ const filenameReservedRegex = /[<>:"/\\|?*]/g; // eslint-disable-next-line no-co
 
 const reControlChars = /[\u0000-\u001f\u0080-\u009f]/g;
 
+function escapeLocalident(localident) {
+  return (0, _cssesc.default)(localident // For `[hash]` placeholder
+  .replace(/^((-?[0-9])|--)/, '_$1').replace(filenameReservedRegex, '-').replace(reControlChars, '-').replace(/\./g, '-'), {
+    isIdentifier: true
+  });
+}
+
 function defaultGetLocalIdent(loaderContext, localIdentName, localName, options) {
   const {
     context,
@@ -85,13 +92,8 @@ function defaultGetLocalIdent(loaderContext, localIdentName, localName, options)
   } = loaderContext;
   const request = normalizePath(_path.default.relative(context, resourcePath)); // eslint-disable-next-line no-param-reassign
 
-  options.content = `${hashPrefix + request}\x00${unescape(localName)}`; // Using `[path]` placeholder outputs `/` we need escape their
-  // Also directories can contains invalid characters for css we need escape their too
-
-  return (0, _cssesc.default)((0, _loaderUtils.interpolateName)(loaderContext, localIdentName, options) // For `[hash]` placeholder
-  .replace(/^((-?[0-9])|--)/, '_$1').replace(filenameReservedRegex, '-').replace(reControlChars, '-').replace(/\./g, '-'), {
-    isIdentifier: true
-  }).replace(/\\\[local\\]/gi, localName);
+  options.content = `${hashPrefix + request}\x00${localName}`;
+  return (0, _loaderUtils.interpolateName)(loaderContext, localIdentName, options);
 }
 
 function normalizeUrl(url, isStringValue) {
@@ -126,17 +128,31 @@ function getFilter(filter, resourcePath) {
   };
 }
 
-const moduleRegExp = /\.module\.\w+$/i;
+function getValidLocalName(localName, exportLocalsConvention) {
+  if (exportLocalsConvention === 'dashesOnly') {
+    return dashesCamelCase(localName);
+  }
+
+  return (0, _camelcase.default)(localName);
+}
+
+const moduleRegExp = /\.module(s)?\.\w+$/i;
+const icssRegExp = /\.icss\.\w+$/i;
 
 function getModulesOptions(rawOptions, loaderContext) {
   const {
     resourcePath
   } = loaderContext;
+  let isIcss;
 
   if (typeof rawOptions.modules === 'undefined') {
     const isModules = moduleRegExp.test(resourcePath);
 
     if (!isModules) {
+      isIcss = icssRegExp.test(resourcePath);
+    }
+
+    if (!isModules && !isIcss) {
       return false;
     }
   } else if (typeof rawOptions.modules === 'boolean' && rawOptions.modules === false) {
@@ -144,7 +160,7 @@ function getModulesOptions(rawOptions, loaderContext) {
   }
 
   let modulesOptions = {
-    compileType: rawOptions.icss ? 'icss' : 'module',
+    compileType: isIcss ? 'icss' : 'module',
     auto: true,
     mode: 'local',
     exportGlobals: false,
@@ -153,7 +169,8 @@ function getModulesOptions(rawOptions, loaderContext) {
     localIdentHashPrefix: '',
     // eslint-disable-next-line no-undefined
     localIdentRegExp: undefined,
-    getLocalIdent: defaultGetLocalIdent,
+    // eslint-disable-next-line no-undefined
+    getLocalIdent: undefined,
     namedExport: false,
     exportLocalsConvention: 'asIs',
     exportOnlyLocals: false
@@ -202,26 +219,24 @@ function getModulesOptions(rawOptions, loaderContext) {
       throw new Error('The "modules.namedExport" option requires the "esModules" option to be enabled');
     }
 
-    if (modulesOptions.exportLocalsConvention !== 'camelCaseOnly') {
-      throw new Error('The "modules.namedExport" option requires the "modules.exportLocalsConvention" option to be "camelCaseOnly"');
+    if (modulesOptions.exportLocalsConvention !== 'camelCaseOnly' && modulesOptions.exportLocalsConvention !== 'dashesOnly') {
+      throw new Error('The "modules.namedExport" option requires the "modules.exportLocalsConvention" option to be "camelCaseOnly" or "dashesOnly"');
     }
   }
 
+  if (/\[emoji(?::(\d+))?\]/i.test(modulesOptions.localIdentName)) {
+    loaderContext.emitWarning('Emoji is deprecated and will be removed in next major release.');
+  }
+
   return modulesOptions;
 }
 
 function normalizeOptions(rawOptions, loaderContext) {
-  if (rawOptions.icss) {
-    loaderContext.emitWarning(new Error('The "icss" option is deprecated, use "modules.compileType: "icss"" instead'));
-  }
-
   const modulesOptions = getModulesOptions(rawOptions, loaderContext);
   return {
     url: typeof rawOptions.url === 'undefined' ? true : rawOptions.url,
     import: typeof rawOptions.import === 'undefined' ? true : rawOptions.import,
     modules: modulesOptions,
-    // TODO remove in the next major release
-    icss: typeof rawOptions.icss === 'undefined' ? false : rawOptions.icss,
     sourceMap: typeof rawOptions.sourceMap === 'boolean' ? rawOptions.sourceMap : loaderContext.sourceMap,
     importLoaders: typeof rawOptions.importLoaders === 'string' ? parseInt(rawOptions.importLoaders, 10) : rawOptions.importLoaders,
     esModule: typeof rawOptions.esModule === 'undefined' ? true : rawOptions.esModule
@@ -276,11 +291,28 @@ function getModulesPlugins(options, loaderContext) {
       mode
     }), (0, _postcssModulesExtractImports.default)(), (0, _postcssModulesScope.default)({
       generateScopedName(exportName) {
-        return getLocalIdent(loaderContext, localIdentName, exportName, {
-          context: localIdentContext,
-          hashPrefix: localIdentHashPrefix,
-          regExp: localIdentRegExp
-        });
+        let localIdent;
+
+        if (typeof getLocalIdent !== 'undefined') {
+          localIdent = getLocalIdent(loaderContext, localIdentName, unescape(exportName), {
+            context: localIdentContext,
+            hashPrefix: localIdentHashPrefix,
+            regExp: localIdentRegExp
+          });
+        } // A null/undefined value signals that we should invoke the default
+        // getLocalIdent method.
+
+
+        if (typeof localIdent === 'undefined' || localIdent === null) {
+          localIdent = defaultGetLocalIdent(loaderContext, localIdentName, unescape(exportName), {
+            context: localIdentContext,
+            hashPrefix: localIdentHashPrefix,
+            regExp: localIdentRegExp
+          });
+          return escapeLocalident(localIdent).replace(/\\\[local\\]/gi, exportName);
+        }
+
+        return escapeLocalident(localIdent);
       },
 
       exportGlobals: options.modules.exportGlobals
@@ -430,7 +462,7 @@ function getModuleCode(result, api, replacements, options, loaderContext) {
 
   const sourceMapValue = options.sourceMap ? `,${normalizeSourceMapForRuntime(result.map, loaderContext)}` : '';
   let code = JSON.stringify(result.css);
-  let beforeCode = `var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(${options.sourceMap});\n`;
+  let beforeCode = `var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(${options.sourceMap ? '___CSS_LOADER_API_SOURCEMAP_IMPORT___' : 'function(i){return i[1]}'});\n`;
 
   for (const item of api) {
     const {
@@ -449,7 +481,7 @@ function getModuleCode(result, api, replacements, options, loaderContext) {
     } = item;
 
     if (localName) {
-      code = code.replace(new RegExp(replacementName, 'g'), () => options.modules.namedExport ? `" + ${importName}_NAMED___[${JSON.stringify((0, _camelcase.default)(localName))}] + "` : `" + ${importName}.locals[${JSON.stringify(localName)}] + "`);
+      code = code.replace(new RegExp(replacementName, 'g'), () => options.modules.namedExport ? `" + ${importName}_NAMED___[${JSON.stringify(getValidLocalName(localName, options.modules.exportLocalsConvention))}] + "` : `" + ${importName}.locals[${JSON.stringify(localName)}] + "`);
     } else {
       const {
         hash,
@@ -475,7 +507,7 @@ function getExportCode(exports, replacements, options) {
 
   const addExportToLocalsCode = (name, value) => {
     if (options.modules.namedExport) {
-      localsCode += `export const ${(0, _camelcase.default)(name)} = ${JSON.stringify(value)};\n`;
+      localsCode += `export const ${name} = ${JSON.stringify(value)};\n`;
     } else {
       if (localsCode) {
         localsCode += `,\n`;
@@ -545,7 +577,7 @@ function getExportCode(exports, replacements, options) {
       } = item;
       localsCode = localsCode.replace(new RegExp(replacementName, 'g'), () => {
         if (options.modules.namedExport) {
-          return `" + ${importName}_NAMED___[${JSON.stringify((0, _camelcase.default)(localName))}] + "`;
+          return `" + ${importName}_NAMED___[${JSON.stringify(getValidLocalName(localName, options.modules.exportLocalsConvention))}] + "`;
         } else if (options.modules.exportOnlyLocals) {
           return `" + ${importName}[${JSON.stringify(localName)}] + "`;
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "css-loader",
-  "version": "4.3.0",
+  "version": "5.0.0",
   "description": "css loader module for webpack",
   "license": "MIT",
   "repository": "webpack-contrib/css-loader",
@@ -43,17 +43,17 @@
     "webpack": "^4.27.0 || ^5.0.0"
   },
   "dependencies": {
-    "camelcase": "^6.0.0",
+    "camelcase": "^6.1.0",
     "cssesc": "^3.0.0",
-    "icss-utils": "^4.1.1",
+    "icss-utils": "^5.0.0",
     "loader-utils": "^2.0.0",
-    "postcss": "^7.0.32",
-    "postcss-modules-extract-imports": "^2.0.0",
-    "postcss-modules-local-by-default": "^3.0.3",
-    "postcss-modules-scope": "^2.2.0",
-    "postcss-modules-values": "^3.0.0",
+    "postcss": "^8.1.1",
+    "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",
-    "schema-utils": "^2.7.1",
+    "schema-utils": "^3.0.0",
     "semver": "^7.3.2"
   },
   "devDependencies": {
@@ -64,35 +64,35 @@
     "@commitlint/config-conventional": "^11.0.0",
     "@webpack-contrib/defaults": "^6.3.0",
     "@webpack-contrib/eslint-config-webpack": "^3.0.0",
-    "babel-jest": "^26.1.0",
+    "babel-jest": "^26.5.2",
     "cross-env": "^7.0.2",
-    "del": "^5.1.0",
+    "del": "^6.0.0",
     "del-cli": "^3.0.1",
-    "es-check": "^5.1.0",
-    "eslint": "^7.8.1",
-    "eslint-config-prettier": "^6.11.0",
-    "eslint-plugin-import": "^2.22.0",
-    "file-loader": "^6.1.0",
+    "es-check": "^5.1.1",
+    "eslint": "^7.11.0",
+    "eslint-config-prettier": "^6.12.0",
+    "eslint-plugin-import": "^2.22.1",
+    "file-loader": "^6.1.1",
     "husky": "^4.3.0",
-    "jest": "^26.4.2",
+    "jest": "^26.5.3",
     "less": "^3.12.2",
-    "less-loader": "^7.0.1",
-    "lint-staged": "^10.3.0",
+    "less-loader": "^7.0.2",
+    "lint-staged": "^10.4.0",
     "memfs": "^3.2.0",
-    "mini-css-extract-plugin": "^0.11.0",
+    "mini-css-extract-plugin": "^1.0.0",
     "npm-run-all": "^4.1.5",
-    "postcss-loader": "^4.0.0",
+    "postcss-loader": "^4.0.4",
     "postcss-preset-env": "^6.7.0",
-    "prettier": "^2.1.1",
-    "sass": "^1.26.10",
-    "sass-loader": "^10.0.2",
+    "prettier": "^2.1.2",
+    "sass": "^1.27.0",
+    "sass-loader": "^10.0.3",
     "standard-version": "^9.0.0",
     "strip-ansi": "^6.0.0",
-    "style-loader": "^1.2.1",
+    "style-loader": "^2.0.0",
     "stylus": "^0.54.8",
-    "stylus-loader": "^3.0.2",
-    "url-loader": "^4.1.0",
-    "webpack": "^4.44.1"
+    "stylus-loader": "^4.1.1",
+    "url-loader": "^4.1.1",
+    "webpack": "^5.0.0"
   },
   "keywords": [
     "webpack",