css-loader - npm Package Compare versions

Comparing version 6.1.0 to 6.2.0

dist/index.js

@@ -183,5 +183,13 @@ "use strict";
   const importCode = (0, _utils.getImportCode)(imports, options);
-  const moduleCode = (0, _utils.getModuleCode)(result, api, replacements, options, this);
+  let moduleCode;
+
+  try {
+    moduleCode = (0, _utils.getModuleCode)(result, api, replacements, options, this);
+  } catch (error) {
+    callback(error);
+    return;
+  }
+
   const exportCode = (0, _utils.getExportCode)(exports, replacements, needToUseIcssPlugin, options);
   callback(null, `${importCode}${moduleCode}${exportCode}`);
 }

dist/options.json

@@ -148,8 +148,15 @@ {
               "link": "https://github.com/webpack-contrib/css-loader#localsconvention",
-              "enum": [
-                "asIs",
-                "camelCase",
-                "camelCaseOnly",
-                "dashes",
-                "dashesOnly"
+              "anyOf": [
+                {
+                  "enum": [
+                    "asIs",
+                    "camelCase",
+                    "camelCaseOnly",
+                    "dashes",
+                    "dashesOnly"
+                  ]
+                },
+                {
+                  "instanceof": "Function"
+                }
               ]
@@ -156,0 +163,0 @@ },

dist/utils.js

@@ -465,2 +465,7 @@ "use strict";
 function getValidLocalName(localName, exportLocalsConvention) {
+  if (typeof exportLocalsConvention === "function") {
+    const result = exportLocalsConvention(localName);
+    return Array.isArray(result) ? result[0] : result;
+  }
+
   if (exportLocalsConvention === "dashesOnly") {
@@ -564,3 +569,3 @@ return dashesCamelCase(localName);
 
-    if (modulesOptions.exportLocalsConvention !== "camelCaseOnly" && modulesOptions.exportLocalsConvention !== "dashesOnly") {
+    if (typeof modulesOptions.exportLocalsConvention === "string" && modulesOptions.exportLocalsConvention !== "camelCaseOnly" && modulesOptions.exportLocalsConvention !== "dashesOnly") {
       throw new Error('The "modules.namedExport" option requires the "modules.exportLocalsConvention" option to be "camelCaseOnly" or "dashesOnly"');
@@ -866,11 +871,15 @@ }
 
-  const addExportToLocalsCode = (name, value) => {
-    if (options.modules.namedExport) {
-      localsCode += `export var ${name} = ${JSON.stringify(value)};\n`;
-    } else {
-      if (localsCode) {
-        localsCode += `,\n`;
+  const addExportToLocalsCode = (names, value) => {
+    const normalizedNames = Array.isArray(names) ? new Set(names) : new Set([names]);
+
+    for (const name of normalizedNames) {
+      if (options.modules.namedExport) {
+        localsCode += `export var ${name} = ${JSON.stringify(value)};\n`;
+      } else {
+        if (localsCode) {
+          localsCode += `,\n`;
+        }
+
+        localsCode += `\t${JSON.stringify(name)}: ${JSON.stringify(value)}`;
       }
-
-      localsCode += `\t${JSON.stringify(name)}: ${JSON.stringify(value)}`;
     }
@@ -883,12 +892,13 @@ };
   } of exports) {
+    if (typeof options.modules.exportLocalsConvention === "function") {
+      addExportToLocalsCode(options.modules.exportLocalsConvention(name), value); // eslint-disable-next-line no-continue
+
+      continue;
+    }
+
     switch (options.modules.exportLocalsConvention) {
       case "camelCase":
         {
-          addExportToLocalsCode(name, value);
           const modifiedName = camelCase(name);
-
-          if (modifiedName !== name) {
-            addExportToLocalsCode(modifiedName, value);
-          }
-
+          addExportToLocalsCode([name, modifiedName], value);
           break;
@@ -905,9 +915,4 @@ }
         {
-          addExportToLocalsCode(name, value);
           const modifiedName = dashesCamelCase(name);
-
-          if (modifiedName !== name) {
-            addExportToLocalsCode(modifiedName, value);
-          }
-
+          addExportToLocalsCode([name, modifiedName], value);
           break;
@@ -914,0 +919,0 @@ }

package.json

 {
   "name": "css-loader",
-  "version": "6.1.0",
+  "version": "6.2.0",
   "description": "css loader module for webpack",
@@ -5,0 +5,0 @@ "license": "MIT",

README.md

@@ -1034,2 +1034,5 @@ <div align="center">
 
+To set a custom name for namedExport, can use [`exportLocalsConvention`](#exportLocalsConvention) option as a function.
+Example below in the [`examples`](#examples) section.
+
 ##### `exportGlobals`
@@ -1064,3 +1067,3 @@
 
-Type: `String`
+Type: `String|Function`
 Default: based on the `modules.namedExport` option value, if `true` - `camelCaseOnly`, otherwise `asIs`
@@ -1070,2 +1073,4 @@
 
+###### `String`
+
 By default, the exported JSON keys mirror the class names (i.e `asIs` value).
@@ -1116,2 +1121,54 @@
 
+###### `Function`
+
+**webpack.config.js**
+
+```js
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /\.css$/i,
+        loader: "css-loader",
+        options: {
+          modules: {
+            exportLocalsConvention: function (name) {
+              return name.replace(/-/g, "_");
+            },
+          },
+        },
+      },
+    ],
+  },
+};
+```
+
+**webpack.config.js**
+
+```js
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /\.css$/i,
+        loader: "css-loader",
+        options: {
+          modules: {
+            exportLocalsConvention: function (name) {
+              return [
+                name.replace(/-/g, "_"),
+                // dashesCamelCase
+                name.replace(/-+(\w)/g, (match, firstLetter) =>
+                  firstLetter.toUpperCase()
+                ),
+              ];
+            },
+          },
+        },
+      },
+    ],
+  },
+};
+```
+
 ##### `exportOnlyLocals`
@@ -1441,2 +1498,27 @@
 
+### Named export with custom export names
+
+**webpack.config.js**
+
+```js
+module.exports = {
+  module: {
+    rules: [
+      {
+        test: /\.css$/i,
+        loader: "css-loader",
+        options: {
+          modules: {
+            namedExport: true,
+            exportLocalsConvention: function (name) {
+              return name.replace(/-/g, "_");
+            },
+          },
+        },
+      },
+    ],
+  },
+};
+```
+
 ### Separating `Interoperable CSS`-only and `CSS Module` features
@@ -1443,0 +1525,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

116680

increased by1.92%

Lines of code

1955

increased by0.93%

Number of lines in readme file

1649

increased by5.23%

No dependency changes