refactor: the hashPrefix option was renamed to the `localIdentHashP…

…refix` option (#1118) BREAKING CHANGE: the `hashPrefix` option was renamed to the `localIdentHashPrefix` option
webpack-contrib · Jul 21, 2020 · 3a96a3d · 3a96a3d
1 parent 0080f88
commit 3a96a3d
Show file tree

Hide file tree

Showing 6 changed files with 45 additions and 44 deletions.
diff --git a/README.md b/README.md
@@ -528,12 +528,13 @@ module.exports = {
         options: {
           modules: {
             mode: 'local',
+            auto: true,
             exportGlobals: true,
             localIdentName: '[path][name]__[local]--[hash:base64:5]',
-            localsConvention: 'camelCase',
             context: path.resolve(__dirname, 'src'),
-            hashPrefix: 'my-custom-hash',
+            localIdentHashPrefix: 'my-custom-hash',
             namedExport: true,
+            localsConvention: 'camelCase',
             exportOnlyLocals: false,
           },
         },
@@ -834,7 +835,7 @@ module.exports = {
 };
 ```
 
-##### `hashPrefix`
+##### `localIdentHashPrefix`
 
 Type: `String`
 Default: `undefined`
@@ -852,7 +853,7 @@ module.exports = {
         loader: 'css-loader',
         options: {
           modules: {
-            hashPrefix: 'hash',
+            localIdentHashPrefix: 'hash',
           },
         },
       },

diff --git a/src/options.json b/src/options.json
@@ -65,6 +65,12 @@
             "localIdentName": {
               "type": "string"
             },
+            "context": {
+              "type": "string"
+            },
+            "localIdentHashPrefix": {
+              "type": "string"
+            },
             "localIdentRegExp": {
               "anyOf": [
                 {
@@ -75,22 +81,6 @@
                 }
               ]
             },
-            "localsConvention": {
-              "description": "Style of exported classnames (https://github.com/webpack-contrib/css-loader#localsconvention).",
-              "enum": [
-                "asIs",
-                "camelCase",
-                "camelCaseOnly",
-                "dashes",
-                "dashesOnly"
-              ]
-            },
-            "context": {
-              "type": "string"
-            },
-            "hashPrefix": {
-              "type": "string"
-            },
             "getLocalIdent": {
               "anyOf": [
                 {
@@ -101,6 +91,16 @@
                 }
               ]
             },
+            "localsConvention": {
+              "description": "Style of exported classnames (https://github.com/webpack-contrib/css-loader#localsconvention).",
+              "enum": [
+                "asIs",
+                "camelCase",
+                "camelCaseOnly",
+                "dashes",
+                "dashesOnly"
+              ]
+            },
             "namedExport": {
               "description": "Use the named export ES modules.",
               "type": "boolean"

diff --git a/src/utils.js b/src/utils.js
@@ -126,11 +126,11 @@ function getModulesOptions(rawOptions, loaderContext) {
     auto: true,
     mode: 'local',
     localIdentName: '[hash:base64]',
+    localIdentHashPrefix: '',
     // eslint-disable-next-line no-undefined
     localIdentRegExp: undefined,
     localsConvention: 'asIs',
     getLocalIdent,
-    hashPrefix: '',
     exportGlobals: false,
     namedExport: false,
     exportOnlyLocals: false,
@@ -246,7 +246,7 @@ function getModulesPlugins(options, loaderContext) {
               exportName,
               {
                 context: options.modules.context,
-                hashPrefix: options.modules.hashPrefix,
+                hashPrefix: options.modules.localIdentHashPrefix,
                 regExp: options.modules.localIdentRegExp,
               }
             );
@@ -259,7 +259,7 @@ function getModulesPlugins(options, loaderContext) {
               exportName,
               {
                 context: options.modules.context,
-                hashPrefix: options.modules.hashPrefix,
+                hashPrefix: options.modules.localIdentHashPrefix,
                 regExp: options.modules.localIdentRegExp,
               }
             );

diff --git a/test/__snapshots__/validate-options.test.js.snap b/test/__snapshots__/validate-options.test.js.snap
@@ -39,7 +39,7 @@ exports[`validate options should throw an error on the "importLoaders" option wi
 exports[`validate options should throw an error on the "modules" option with "{"auto":"invalid"}" value 1`] = `
 "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
  - options.modules should be one of these:
-   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, localIdentRegExp?, localsConvention?, context?, hashPrefix?, getLocalIdent?, namedExport?, exportOnlyLocals? }
+   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, context?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, localsConvention?, namedExport?, exportOnlyLocals? }
    -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
    Details:
     * options.modules.auto should be one of these:
@@ -69,7 +69,7 @@ exports[`validate options should throw an error on the "modules" option with "{"
 exports[`validate options should throw an error on the "modules" option with "{"getLocalIdent":[]}" value 1`] = `
 "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
  - options.modules should be one of these:
-   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, localIdentRegExp?, localsConvention?, context?, hashPrefix?, getLocalIdent?, namedExport?, exportOnlyLocals? }
+   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, context?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, localsConvention?, namedExport?, exportOnlyLocals? }
    -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
    Details:
     * options.modules.getLocalIdent should be one of these:
@@ -79,9 +79,9 @@ exports[`validate options should throw an error on the "modules" option with "{"
        * options.modules.getLocalIdent should be an instance of function."
 `;
 
-exports[`validate options should throw an error on the "modules" option with "{"hashPrefix":true}" value 1`] = `
+exports[`validate options should throw an error on the "modules" option with "{"localIdentHashPrefix":true}" value 1`] = `
 "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
- - options.modules.hashPrefix should be a string."
+ - options.modules.localIdentHashPrefix should be a string."
 `;
 
 exports[`validate options should throw an error on the "modules" option with "{"localIdentName":true}" value 1`] = `
@@ -92,7 +92,7 @@ exports[`validate options should throw an error on the "modules" option with "{"
 exports[`validate options should throw an error on the "modules" option with "{"localIdentRegExp":true}" value 1`] = `
 "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
  - options.modules should be one of these:
-   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, localIdentRegExp?, localsConvention?, context?, hashPrefix?, getLocalIdent?, namedExport?, exportOnlyLocals? }
+   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, context?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, localsConvention?, namedExport?, exportOnlyLocals? }
    -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
    Details:
     * options.modules.localIdentRegExp should be one of these:
@@ -112,7 +112,7 @@ exports[`validate options should throw an error on the "modules" option with "{"
 exports[`validate options should throw an error on the "modules" option with "{"mode":"globals"}" value 1`] = `
 "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
  - options.modules should be one of these:
-   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, localIdentRegExp?, localsConvention?, context?, hashPrefix?, getLocalIdent?, namedExport?, exportOnlyLocals? }
+   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, context?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, localsConvention?, namedExport?, exportOnlyLocals? }
    -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
    Details:
     * options.modules.mode should be one of these:
@@ -126,7 +126,7 @@ exports[`validate options should throw an error on the "modules" option with "{"
 exports[`validate options should throw an error on the "modules" option with "{"mode":"locals"}" value 1`] = `
 "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
  - options.modules should be one of these:
-   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, localIdentRegExp?, localsConvention?, context?, hashPrefix?, getLocalIdent?, namedExport?, exportOnlyLocals? }
+   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, context?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, localsConvention?, namedExport?, exportOnlyLocals? }
    -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
    Details:
     * options.modules.mode should be one of these:
@@ -140,7 +140,7 @@ exports[`validate options should throw an error on the "modules" option with "{"
 exports[`validate options should throw an error on the "modules" option with "{"mode":"pures"}" value 1`] = `
 "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
  - options.modules should be one of these:
-   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, localIdentRegExp?, localsConvention?, context?, hashPrefix?, getLocalIdent?, namedExport?, exportOnlyLocals? }
+   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, context?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, localsConvention?, namedExport?, exportOnlyLocals? }
    -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
    Details:
     * options.modules.mode should be one of these:
@@ -154,7 +154,7 @@ exports[`validate options should throw an error on the "modules" option with "{"
 exports[`validate options should throw an error on the "modules" option with "{"mode":true}" value 1`] = `
 "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
  - options.modules should be one of these:
-   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, localIdentRegExp?, localsConvention?, context?, hashPrefix?, getLocalIdent?, namedExport?, exportOnlyLocals? }
+   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, context?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, localsConvention?, namedExport?, exportOnlyLocals? }
    -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
    Details:
     * options.modules.mode should be one of these:
@@ -174,53 +174,53 @@ exports[`validate options should throw an error on the "modules" option with "{"
 exports[`validate options should throw an error on the "modules" option with "globals" value 1`] = `
 "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
  - options.modules should be one of these:
-   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, localIdentRegExp?, localsConvention?, context?, hashPrefix?, getLocalIdent?, namedExport?, exportOnlyLocals? }
+   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, context?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, localsConvention?, namedExport?, exportOnlyLocals? }
    -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
    Details:
     * options.modules should be a boolean.
     * options.modules should be one of these:
       \\"local\\" | \\"global\\" | \\"pure\\"
     * options.modules should be an object:
-      object { auto?, mode?, exportGlobals?, localIdentName?, localIdentRegExp?, localsConvention?, context?, hashPrefix?, getLocalIdent?, namedExport?, exportOnlyLocals? }"
+      object { auto?, mode?, exportGlobals?, localIdentName?, context?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, localsConvention?, namedExport?, exportOnlyLocals? }"
 `;
 
 exports[`validate options should throw an error on the "modules" option with "locals" value 1`] = `
 "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
  - options.modules should be one of these:
-   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, localIdentRegExp?, localsConvention?, context?, hashPrefix?, getLocalIdent?, namedExport?, exportOnlyLocals? }
+   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, context?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, localsConvention?, namedExport?, exportOnlyLocals? }
    -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
    Details:
     * options.modules should be a boolean.
     * options.modules should be one of these:
       \\"local\\" | \\"global\\" | \\"pure\\"
     * options.modules should be an object:
-      object { auto?, mode?, exportGlobals?, localIdentName?, localIdentRegExp?, localsConvention?, context?, hashPrefix?, getLocalIdent?, namedExport?, exportOnlyLocals? }"
+      object { auto?, mode?, exportGlobals?, localIdentName?, context?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, localsConvention?, namedExport?, exportOnlyLocals? }"
 `;
 
 exports[`validate options should throw an error on the "modules" option with "pures" value 1`] = `
 "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
  - options.modules should be one of these:
-   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, localIdentRegExp?, localsConvention?, context?, hashPrefix?, getLocalIdent?, namedExport?, exportOnlyLocals? }
+   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, context?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, localsConvention?, namedExport?, exportOnlyLocals? }
    -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
    Details:
     * options.modules should be a boolean.
     * options.modules should be one of these:
       \\"local\\" | \\"global\\" | \\"pure\\"
     * options.modules should be an object:
-      object { auto?, mode?, exportGlobals?, localIdentName?, localIdentRegExp?, localsConvention?, context?, hashPrefix?, getLocalIdent?, namedExport?, exportOnlyLocals? }"
+      object { auto?, mode?, exportGlobals?, localIdentName?, context?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, localsConvention?, namedExport?, exportOnlyLocals? }"
 `;
 
 exports[`validate options should throw an error on the "modules" option with "true" value 1`] = `
 "Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.
  - options.modules should be one of these:
-   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, localIdentRegExp?, localsConvention?, context?, hashPrefix?, getLocalIdent?, namedExport?, exportOnlyLocals? }
+   boolean | \\"local\\" | \\"global\\" | \\"pure\\" | object { auto?, mode?, exportGlobals?, localIdentName?, context?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, localsConvention?, namedExport?, exportOnlyLocals? }
    -> Enables/Disables CSS Modules and their configuration (https://github.com/webpack-contrib/css-loader#modules).
    Details:
     * options.modules should be a boolean.
     * options.modules should be one of these:
       \\"local\\" | \\"global\\" | \\"pure\\"
     * options.modules should be an object:
-      object { auto?, mode?, exportGlobals?, localIdentName?, localIdentRegExp?, localsConvention?, context?, hashPrefix?, getLocalIdent?, namedExport?, exportOnlyLocals? }"
+      object { auto?, mode?, exportGlobals?, localIdentName?, context?, localIdentHashPrefix?, localIdentRegExp?, getLocalIdent?, localsConvention?, namedExport?, exportOnlyLocals? }"
 `;
 
 exports[`validate options should throw an error on the "sourceMap" option with "true" value 1`] = `

diff --git a/test/modules-option.test.js b/test/modules-option.test.js
@@ -156,7 +156,7 @@ describe('"modules" option', () => {
     const compiler = getCompiler('./modules/localIdentName/localIdentName.js', {
       modules: {
         localIdentName: '[local]--[hash]',
-        hashPrefix: 'x',
+        localIdentHashPrefix: 'x',
       },
     });
     const stats = await compile(compiler);
@@ -242,7 +242,7 @@ describe('"modules" option', () => {
       modules: {
         localIdentRegExp: 'regExp',
         context: 'context',
-        hashPrefix: 'hash',
+        localIdentHashPrefix: 'hash',
         getLocalIdent(loaderContext, localIdentName, localName, options) {
           expect(loaderContext).toBeDefined();
           expect(typeof localIdentName).toBe('string');

diff --git a/test/validate-options.test.js b/test/validate-options.test.js
@@ -23,7 +23,7 @@ describe('validate options', () => {
         { mode: () => 'local' },
         { localIdentName: '[path][name]__[local]--[hash:base64:5]' },
         { context: 'context' },
-        { hashPrefix: 'hash' },
+        { localIdentHashPrefix: 'hash' },
         { getLocalIdent: () => {} },
         { localIdentRegExp: 'page-(.*)\\.js' },
         { localIdentRegExp: /page-(.*)\.js/ },
@@ -53,7 +53,7 @@ describe('validate options', () => {
         { mode: 'pures' },
         { localIdentName: true },
         { context: true },
-        { hashPrefix: true },
+        { localIdentHashPrefix: true },
         { getLocalIdent: [] },
         { localIdentRegExp: true },
         { exportGlobals: 'invalid' },