Skip to content

Commit 976ff89

Browse files
subzeysubzey
committed
feat: do not hash localName if the localName is inlined:
Remove senseless .modules.hashStrategy = "omit-local-name"
1 parent 8e93b75 commit 976ff89

File tree

5 files changed

+7
-229
lines changed

5 files changed

+7
-229
lines changed

‎README.md

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -874,14 +874,13 @@ module.exports = {
874874

875875
##### `hashStrategy`
876876

877-
Type: `'use-local-name' | 'omit-local-name' | 'auto'`
877+
Type: `'use-local-name' | 'auto'`
878878
Default: `'use-local-name'`
879879

880880
Should local name be used when computing the hash.
881881

882-
- `'auto'` Auto detect based on [localIdentName](#localidentname). Use this value to get the output that is better compressable by GZIP or Brotli.
883882
- `'use-local-name'` Each identifier in a module gets its own hash digest.
884-
- `'omit-local-name'` All identifiers from the same module shares the same hash digest. Handle with care!
883+
- `'auto'` Identifiers from the same module shares the same hash digest if it's possible. Use this value to optimize the output for better GZIP or Brotli compression.
885884

886885
**webpack.config.js**
887886

‎src/options.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,7 @@
117117
"hashStrategy": {
118118
"description": "Allows to specify should localName be used when computing the hash.",
119119
"link": "https://github.com/webpack-contrib/css-loader#hashstrategy",
120-
"enum": ["use-local-name", "omit-local-name", "auto"]
120+
"enum": ["use-local-name", "auto"]
121121
},
122122
"localIdentRegExp": {
123123
"description": "Allows to specify custom RegExp for local ident name.",

‎src/utils.js

Lines changed: 4 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -336,22 +336,11 @@ function defaultGetLocalIdent(
336336
path.relative(context, resourcePath)
337337
);
338338

339-
let useLocalNameInHash;
340-
switch (hashStrategy) {
341-
case "omit-local-name":
342-
useLocalNameInHash = false;
343-
break;
344-
case "auto":
345-
useLocalNameInHash = !/\[local\]/.test(localIdentName);
346-
break;
347-
default:
348-
// undefined or "use-local-name"
349-
useLocalNameInHash = true;
350-
}
351339
// eslint-disable-next-line no-param-reassign
352-
options.content = useLocalNameInHash
353-
? `${relativeResourcePath}\x00${localName}`
354-
: relativeResourcePath;
340+
options.content =
341+
hashStrategy === "auto" && /\[local\]/.test(localIdentName)
342+
? relativeResourcePath
343+
: `${relativeResourcePath}\x00${localName}`;
355344

356345
let { hashFunction, hashDigest, hashDigestLength } = options;
357346
const matches = localIdentName.match(

‎test/__snapshots__/modules-option.test.js.snap

Lines changed: 0 additions & 190 deletions
Original file line numberDiff line numberDiff line change
@@ -3777,196 +3777,6 @@ Array [
37773777

37783778
exports[`"modules" option should work and respect the "hashStrategy" = "auto" and no [local]: warnings 1`] = `Array []`;
37793779

3780-
exports[`"modules" option should work and respect the "hashStrategy" = "omit-local-name": errors 1`] = `Array []`;
3781-
3782-
exports[`"modules" option should work and respect the "hashStrategy" = "omit-local-name": module 1`] = `
3783-
"// Imports
3784-
import ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ from \\"../../../../src/runtime/noSourceMaps.js\\";
3785-
import ___CSS_LOADER_API_IMPORT___ from \\"../../../../src/runtime/api.js\\";
3786-
var ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);
3787-
// Module
3788-
___CSS_LOADER_EXPORT___.push([module.id, \\".iHMJbI42 {\\\\n background: red;\\\\n}\\\\n\\\\n.iHMJbI42 {\\\\n background: blue;\\\\n}\\\\n\\\\n.iHMJbI42 {\\\\n background: red;\\\\n}\\\\n\\\\n#iHMJbI42 {\\\\n background: green;\\\\n}\\\\n\\\\n.iHMJbI42 .iHMJbI42 {\\\\n color: green;\\\\n}\\\\n\\\\n#iHMJbI42 .iHMJbI42 {\\\\n color: blue;\\\\n}\\\\n\\\\n.iHMJbI42 {\\\\n color: red;\\\\n}\\\\n\\\\n.iHMJbI42 {\\\\n margin-left: auto !important;\\\\n margin-right: auto !important;\\\\n}\\\\n\\\\n.iHMJbI42 {\\\\n margin-left: auto !important;\\\\n margin-right: auto !important;\\\\n}\\\\n\\\\n/* matches elements with class=\\\\\\":\`(\\\\\\" */\\\\n.iHMJbI42 {\\\\n color: aqua;\\\\n}\\\\n\\\\n/* matches elements with class=\\\\\\"1a2b3c\\\\\\" */\\\\n.iHMJbI42 {\\\\n color: aliceblue;\\\\n}\\\\n\\\\n/* matches the element with id=\\\\\\"#fake-id\\\\\\" */\\\\n#iHMJbI42 {\\\\n color: antiquewhite;\\\\n}\\\\n\\\\n/* matches the element with id=\\\\\\"-a-b-c-\\\\\\" */\\\\n#iHMJbI42 {\\\\n color: azure;\\\\n}\\\\n\\\\n/* matches the element with id=\\\\\\"©\\\\\\" */\\\\n#iHMJbI42 {\\\\n color: black;\\\\n}\\\\n\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n.iHMJbI42 { background: lime; }\\\\n\\\\n.iHMJbI42 {\\\\n background: hotpink;\\\\n}\\\\n\\\\n.iHMJbI42 {\\\\n background: hotpink;\\\\n}\\\\n\\\\n.iHMJbI42 {\\\\n background: hotpink;\\\\n}\\\\n\\\\n.iHMJbI42 {\\\\n background: hotpink;\\\\n}\\\\n\\", \\"\\"]);
3789-
// Exports
3790-
___CSS_LOADER_EXPORT___.locals = {
3791-
\\"123\\": \\"iHMJbI42\\",
3792-
\\"test\\": \\"iHMJbI42\\",
3793-
\\"_test\\": \\"iHMJbI42\\",
3794-
\\"className\\": \\"iHMJbI42\\",
3795-
\\"someId\\": \\"iHMJbI42\\",
3796-
\\"subClass\\": \\"iHMJbI42\\",
3797-
\\"-a0-34a___f\\": \\"iHMJbI42\\",
3798-
\\"m_x_@\\": \\"iHMJbI42\\",
3799-
\\"B&W?\\": \\"iHMJbI42\\",
3800-
\\":\`(\\": \\"iHMJbI42\\",
3801-
\\"1a2b3c\\": \\"iHMJbI42\\",
3802-
\\"#fake-id\\": \\"iHMJbI42\\",
3803-
\\"-a-b-c-\\": \\"iHMJbI42\\",
3804-
\\"©\\": \\"iHMJbI42\\",
3805-
\\"♥\\": \\"iHMJbI42\\",
3806-
\\"😍\\": \\"iHMJbI42\\",
3807-
\\"“‘’”\\": \\"iHMJbI42\\",
3808-
\\"☺☃\\": \\"iHMJbI42\\",
3809-
\\"⌘⌥\\": \\"iHMJbI42\\",
3810-
\\"𝄞♪♩♫♬\\": \\"iHMJbI42\\",
3811-
\\"💩\\": \\"iHMJbI42\\",
3812-
\\"?\\": \\"iHMJbI42\\",
3813-
\\"@\\": \\"iHMJbI42\\",
3814-
\\".\\": \\"iHMJbI42\\",
3815-
\\":)\\": \\"iHMJbI42\\",
3816-
\\"<p>\\": \\"iHMJbI42\\",
3817-
\\"<><<<>><>\\": \\"iHMJbI42\\",
3818-
\\"++++++++++[>+++++++>++++++++++>+++>+<<<<-]>++.>+.+++++++..+++.>++.<<+++++++++++++++.>.+++.------.--------.>+.>.\\": \\"iHMJbI42\\",
3819-
\\"#\\": \\"iHMJbI42\\",
3820-
\\"##\\": \\"iHMJbI42\\",
3821-
\\"#.#.#\\": \\"iHMJbI42\\",
3822-
\\"_\\": \\"iHMJbI42\\",
3823-
\\"{}\\": \\"iHMJbI42\\",
3824-
\\"foo.bar\\": \\"iHMJbI42\\",
3825-
\\":hover\\": \\"iHMJbI42\\",
3826-
\\":hover:focus:active\\": \\"iHMJbI42\\",
3827-
\\"[attr=value]\\": \\"iHMJbI42\\",
3828-
\\"f/o/o\\": \\"iHMJbI42\\",
3829-
\\"f\\\\\\\\o\\\\\\\\o\\": \\"iHMJbI42\\",
3830-
\\"f*o*o\\": \\"iHMJbI42\\",
3831-
\\"f!o!o\\": \\"iHMJbI42\\",
3832-
\\"f'o'o\\": \\"iHMJbI42\\",
3833-
\\"f~o~o\\": \\"iHMJbI42\\",
3834-
\\"f+o+o\\": \\"iHMJbI42\\",
3835-
\\"foo/bar\\": \\"iHMJbI42\\",
3836-
\\"foo\\\\\\\\bar\\": \\"iHMJbI42\\",
3837-
\\"foo/bar/baz\\": \\"iHMJbI42\\",
3838-
\\"foo\\\\\\\\bar\\\\\\\\baz\\": \\"iHMJbI42\\"
3839-
};
3840-
export default ___CSS_LOADER_EXPORT___;
3841-
"
3842-
`;
3843-
3844-
exports[`"modules" option should work and respect the "hashStrategy" = "omit-local-name": result 1`] = `
3845-
Array [
3846-
Array [
3847-
"./modules/localIdentName/localIdentName.css",
3848-
".iHMJbI42 {
3849-
background: red;
3850-
}
3851-
3852-
.iHMJbI42 {
3853-
background: blue;
3854-
}
3855-
3856-
.iHMJbI42 {
3857-
background: red;
3858-
}
3859-
3860-
#iHMJbI42 {
3861-
background: green;
3862-
}
3863-
3864-
.iHMJbI42 .iHMJbI42 {
3865-
color: green;
3866-
}
3867-
3868-
#iHMJbI42 .iHMJbI42 {
3869-
color: blue;
3870-
}
3871-
3872-
.iHMJbI42 {
3873-
color: red;
3874-
}
3875-
3876-
.iHMJbI42 {
3877-
margin-left: auto !important;
3878-
margin-right: auto !important;
3879-
}
3880-
3881-
.iHMJbI42 {
3882-
margin-left: auto !important;
3883-
margin-right: auto !important;
3884-
}
3885-
3886-
/* matches elements with class=\\":\`(\\" */
3887-
.iHMJbI42 {
3888-
color: aqua;
3889-
}
3890-
3891-
/* matches elements with class=\\"1a2b3c\\" */
3892-
.iHMJbI42 {
3893-
color: aliceblue;
3894-
}
3895-
3896-
/* matches the element with id=\\"#fake-id\\" */
3897-
#iHMJbI42 {
3898-
color: antiquewhite;
3899-
}
3900-
3901-
/* matches the element with id=\\"-a-b-c-\\" */
3902-
#iHMJbI42 {
3903-
color: azure;
3904-
}
3905-
3906-
/* matches the element with id=\\"©\\" */
3907-
#iHMJbI42 {
3908-
color: black;
3909-
}
3910-
3911-
.iHMJbI42 { background: lime; }
3912-
.iHMJbI42 { background: lime; }
3913-
.iHMJbI42 { background: lime; }
3914-
.iHMJbI42 { background: lime; }
3915-
.iHMJbI42 { background: lime; }
3916-
.iHMJbI42 { background: lime; }
3917-
.iHMJbI42 { background: lime; }
3918-
.iHMJbI42 { background: lime; }
3919-
.iHMJbI42 { background: lime; }
3920-
.iHMJbI42 { background: lime; }
3921-
.iHMJbI42 { background: lime; }
3922-
.iHMJbI42 { background: lime; }
3923-
.iHMJbI42 { background: lime; }
3924-
.iHMJbI42 { background: lime; }
3925-
.iHMJbI42 { background: lime; }
3926-
.iHMJbI42 { background: lime; }
3927-
.iHMJbI42 { background: lime; }
3928-
.iHMJbI42 { background: lime; }
3929-
.iHMJbI42 { background: lime; }
3930-
.iHMJbI42 { background: lime; }
3931-
.iHMJbI42 { background: lime; }
3932-
.iHMJbI42 { background: lime; }
3933-
.iHMJbI42 { background: lime; }
3934-
.iHMJbI42 { background: lime; }
3935-
.iHMJbI42 { background: lime; }
3936-
.iHMJbI42 { background: lime; }
3937-
.iHMJbI42 { background: lime; }
3938-
.iHMJbI42 { background: lime; }
3939-
.iHMJbI42 { background: lime; }
3940-
.iHMJbI42 { background: lime; }
3941-
.iHMJbI42 { background: lime; }
3942-
.iHMJbI42 { background: lime; }
3943-
.iHMJbI42 { background: lime; }
3944-
.iHMJbI42 { background: lime; }
3945-
.iHMJbI42 { background: lime; }
3946-
3947-
.iHMJbI42 {
3948-
background: hotpink;
3949-
}
3950-
3951-
.iHMJbI42 {
3952-
background: hotpink;
3953-
}
3954-
3955-
.iHMJbI42 {
3956-
background: hotpink;
3957-
}
3958-
3959-
.iHMJbI42 {
3960-
background: hotpink;
3961-
}
3962-
",
3963-
"",
3964-
],
3965-
]
3966-
`;
3967-
3968-
exports[`"modules" option should work and respect the "hashStrategy" = "omit-local-name": warnings 1`] = `Array []`;
3969-
39703780
exports[`"modules" option should work and respect the "hashStrategy" = "use-local-name": errors 1`] = `Array []`;
39713781

39723782
exports[`"modules" option should work and respect the "hashStrategy" = "use-local-name": module 1`] = `

‎test/modules-option.test.js

Lines changed: 0 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -401,26 +401,6 @@ describe('"modules" option', () => {
401401
expect(getErrors(stats)).toMatchSnapshot("errors");
402402
});
403403

404-
it('should work and respect the "hashStrategy" = "omit-local-name"', async () => {
405-
const compiler = getCompiler("./modules/localIdentName/localIdentName.js", {
406-
modules: {
407-
localIdentName: "[hash:base64:8]",
408-
// localName should not be used even if [local] is absent from the localIdentName template
409-
hashStrategy: "omit-local-name",
410-
},
411-
});
412-
const stats = await compile(compiler);
413-
414-
expect(
415-
getModuleSource("./modules/localIdentName/localIdentName.css", stats)
416-
).toMatchSnapshot("module");
417-
expect(getExecutedCode("main.bundle.js", compiler, stats)).toMatchSnapshot(
418-
"result"
419-
);
420-
expect(getWarnings(stats)).toMatchSnapshot("warnings");
421-
expect(getErrors(stats)).toMatchSnapshot("errors");
422-
});
423-
424404
it('should work and respect the "hashStrategy" = "auto" and [local]', async () => {
425405
const compiler = getCompiler("./modules/localIdentName/localIdentName.js", {
426406
modules: {

0 commit comments

Comments
 (0)