CssLocalIdentifierDependency.js 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191
  1. /*
  2. MIT License http://www.opensource.org/licenses/mit-license.php
  3. Author Ivan Kopeykin @vankop
  4. */
  5. "use strict";
  6. const createHash = require("../util/createHash");
  7. const { makePathsRelative } = require("../util/identifier");
  8. const makeSerializable = require("../util/makeSerializable");
  9. const NullDependency = require("./NullDependency");
  10. /** @typedef {import("webpack-sources").ReplaceSource} ReplaceSource */
  11. /** @typedef {import("../../declarations/WebpackOptions").CssGeneratorExportsConvention} CssGeneratorExportsConvention */
  12. /** @typedef {import("../../declarations/WebpackOptions").CssGeneratorLocalIdentName} CssGeneratorLocalIdentName */
  13. /** @typedef {import("../ChunkGraph")} ChunkGraph */
  14. /** @typedef {import("../CssModule")} CssModule */
  15. /** @typedef {import("../Dependency")} Dependency */
  16. /** @typedef {import("../Dependency").ExportsSpec} ExportsSpec */
  17. /** @typedef {import("../DependencyTemplate").CssDependencyTemplateContext} DependencyTemplateContext */
  18. /** @typedef {import("../ModuleGraph")} ModuleGraph */
  19. /** @typedef {import("../RuntimeTemplate")} RuntimeTemplate */
  20. /** @typedef {import("../css/CssExportsGenerator")} CssExportsGenerator */
  21. /** @typedef {import("../css/CssGenerator")} CssGenerator */
  22. /** @typedef {import("../css/CssParser").Range} Range */
  23. /** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
  24. /** @typedef {import("../serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */
  25. /**
  26. * @param {string} local css local
  27. * @param {CssModule} module module
  28. * @param {ChunkGraph} chunkGraph chunk graph
  29. * @param {RuntimeTemplate} runtimeTemplate runtime template
  30. * @returns {string} local ident
  31. */
  32. const getLocalIdent = (local, module, chunkGraph, runtimeTemplate) => {
  33. const localIdentName =
  34. /** @type {CssGenerator | CssExportsGenerator} */
  35. (module.generator).localIdentName;
  36. const relativeResourcePath = makePathsRelative(
  37. /** @type {string} */ (module.context),
  38. module.resourceResolveData.path
  39. );
  40. const { hashFunction, hashDigest, hashDigestLength, hashSalt, uniqueName } =
  41. runtimeTemplate.outputOptions;
  42. const hash = createHash(hashFunction);
  43. if (hashSalt) {
  44. hash.update(hashSalt);
  45. }
  46. hash.update(relativeResourcePath);
  47. if (!/\[local\]/.test(localIdentName)) {
  48. hash.update(local);
  49. }
  50. const localIdentHash = /** @type {string} */ (hash.digest(hashDigest))
  51. // Remove all leading digits
  52. .replace(/^\d+/, "")
  53. // Replace all slashes with underscores (same as in base64url)
  54. .replace(/\//g, "_")
  55. // Remove everything that is not an alphanumeric or underscore
  56. .replace(/[^A-Za-z0-9_]+/g, "_")
  57. .slice(0, hashDigestLength);
  58. return runtimeTemplate.compilation
  59. .getPath(localIdentName, {
  60. filename: relativeResourcePath,
  61. hash: localIdentHash,
  62. contentHash: localIdentHash,
  63. chunkGraph,
  64. module
  65. })
  66. .replace(/\[local\]/g, local)
  67. .replace(/\[uniqueName\]/g, uniqueName);
  68. };
  69. class CssLocalIdentifierDependency extends NullDependency {
  70. /**
  71. * @param {string} name name
  72. * @param {Range} range range
  73. * @param {string=} prefix prefix
  74. */
  75. constructor(name, range, prefix = "") {
  76. super();
  77. this.name = name;
  78. this.range = range;
  79. this.prefix = prefix;
  80. }
  81. get type() {
  82. return "css local identifier";
  83. }
  84. /**
  85. * Returns the exported names
  86. * @param {ModuleGraph} moduleGraph module graph
  87. * @returns {ExportsSpec | undefined} export names
  88. */
  89. getExports(moduleGraph) {
  90. const name = this.name;
  91. return {
  92. exports: [
  93. {
  94. name,
  95. canMangle: true
  96. }
  97. ],
  98. dependencies: undefined
  99. };
  100. }
  101. /**
  102. * @param {ObjectSerializerContext} context context
  103. */
  104. serialize(context) {
  105. const { write } = context;
  106. write(this.name);
  107. write(this.range);
  108. write(this.prefix);
  109. super.serialize(context);
  110. }
  111. /**
  112. * @param {ObjectDeserializerContext} context context
  113. */
  114. deserialize(context) {
  115. const { read } = context;
  116. this.name = read();
  117. this.range = read();
  118. this.prefix = read();
  119. super.deserialize(context);
  120. }
  121. }
  122. /**
  123. * @param {string} str string
  124. * @param {string | boolean} omitUnderscore true if you need to omit underscore
  125. * @returns {string} escaped css identifier
  126. */
  127. const escapeCssIdentifier = (str, omitUnderscore) => {
  128. const escaped = `${str}`.replace(
  129. // cspell:word uffff
  130. /[^a-zA-Z0-9_\u0081-\uffff-]/g,
  131. s => `\\${s}`
  132. );
  133. return !omitUnderscore && /^(?!--)[0-9-]/.test(escaped)
  134. ? `_${escaped}`
  135. : escaped;
  136. };
  137. CssLocalIdentifierDependency.Template = class CssLocalIdentifierDependencyTemplate extends (
  138. NullDependency.Template
  139. ) {
  140. /**
  141. * @param {Dependency} dependency the dependency for which the template should be applied
  142. * @param {ReplaceSource} source the current replace source which can be modified
  143. * @param {DependencyTemplateContext} templateContext the context object
  144. * @returns {void}
  145. */
  146. apply(
  147. dependency,
  148. source,
  149. { module, moduleGraph, chunkGraph, runtime, runtimeTemplate, cssExports }
  150. ) {
  151. const dep = /** @type {CssLocalIdentifierDependency} */ (dependency);
  152. const used = moduleGraph
  153. .getExportInfo(module, dep.name)
  154. .getUsedName(dep.name, runtime);
  155. if (!used) return;
  156. const localIdent =
  157. dep.prefix +
  158. getLocalIdent(
  159. used,
  160. /** @type {CssModule} */ (module),
  161. chunkGraph,
  162. runtimeTemplate
  163. );
  164. source.replace(
  165. dep.range[0],
  166. dep.range[1] - 1,
  167. escapeCssIdentifier(localIdent, dep.prefix)
  168. );
  169. if (used) cssExports.set(used, localIdent);
  170. }
  171. };
  172. makeSerializable(
  173. CssLocalIdentifierDependency,
  174. "webpack/lib/dependencies/CssLocalIdentifierDependency"
  175. );
  176. module.exports = CssLocalIdentifierDependency;