diff --git a/README.md b/README.md index 83d1a51c..19cb17a6 100644 --- 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 index 215568e5..6c226e37 100644 --- 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 index bf0606a7..ecaee9a2 100644 --- 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 index beca9066..f829b813 100644 --- 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 index 88da8ad5..b05c23d1 100644 --- 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 index 8556e958..0ef49812 100644 --- 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' },