CssLocalIdentifierDependency.js 7.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253
  1. /*
  2. MIT License http://www.opensource.org/licenses/mit-license.php
  3. Author Ivan Kopeykin @vankop
  4. */
  5. "use strict";
  6. const { cssExportConvention } = require("../util/conventions");
  7. const createHash = require("../util/createHash");
  8. const { makePathsRelative } = require("../util/identifier");
  9. const makeSerializable = require("../util/makeSerializable");
  10. const memoize = require("../util/memoize");
  11. const NullDependency = require("./NullDependency");
  12. /** @typedef {import("webpack-sources").ReplaceSource} ReplaceSource */
  13. /** @typedef {import("../../declarations/WebpackOptions").CssGeneratorExportsConvention} CssGeneratorExportsConvention */
  14. /** @typedef {import("../../declarations/WebpackOptions").CssGeneratorLocalIdentName} CssGeneratorLocalIdentName */
  15. /** @typedef {import("../../declarations/WebpackOptions").HashFunction} HashFunction */
  16. /** @typedef {import("../ChunkGraph")} ChunkGraph */
  17. /** @typedef {import("../CssModule")} CssModule */
  18. /** @typedef {import("../Dependency")} Dependency */
  19. /** @typedef {import("../Dependency").ExportsSpec} ExportsSpec */
  20. /** @typedef {import("../Dependency").UpdateHashContext} UpdateHashContext */
  21. /** @typedef {import("../DependencyTemplate").CssDependencyTemplateContext} DependencyTemplateContext */
  22. /** @typedef {import("../ModuleGraph")} ModuleGraph */
  23. /** @typedef {import("../NormalModuleFactory").ResourceDataWithData} ResourceDataWithData */
  24. /** @typedef {import("../RuntimeTemplate")} RuntimeTemplate */
  25. /** @typedef {import("../css/CssGenerator")} CssGenerator */
  26. /** @typedef {import("../css/CssParser").Range} Range */
  27. /** @typedef {import("../serialization/ObjectMiddleware").ObjectDeserializerContext} ObjectDeserializerContext */
  28. /** @typedef {import("../serialization/ObjectMiddleware").ObjectSerializerContext} ObjectSerializerContext */
  29. /** @typedef {import("../util/Hash")} Hash */
  30. const getCssParser = memoize(() => require("../css/CssParser"));
  31. /**
  32. * @param {string} local css local
  33. * @param {CssModule} module module
  34. * @param {ChunkGraph} chunkGraph chunk graph
  35. * @param {RuntimeTemplate} runtimeTemplate runtime template
  36. * @returns {string} local ident
  37. */
  38. const getLocalIdent = (local, module, chunkGraph, runtimeTemplate) => {
  39. const generator = /** @type {CssGenerator} */ (module.generator);
  40. const localIdentName =
  41. /** @type {CssGeneratorLocalIdentName} */
  42. (generator.localIdentName);
  43. const relativeResourcePath = makePathsRelative(
  44. /** @type {string} */
  45. (module.context),
  46. module.matchResource || module.resource,
  47. runtimeTemplate.compilation.compiler.root
  48. );
  49. const { hashFunction, hashDigest, hashDigestLength, hashSalt, uniqueName } =
  50. runtimeTemplate.outputOptions;
  51. const hash = createHash(/** @type {HashFunction} */ (hashFunction));
  52. if (hashSalt) {
  53. hash.update(hashSalt);
  54. }
  55. hash.update(relativeResourcePath);
  56. if (!/\[local\]/.test(localIdentName)) {
  57. hash.update(local);
  58. }
  59. const localIdentHash =
  60. /** @type {string} */
  61. (hash.digest(hashDigest)).slice(0, hashDigestLength);
  62. return runtimeTemplate.compilation
  63. .getPath(localIdentName, {
  64. filename: relativeResourcePath,
  65. hash: localIdentHash,
  66. contentHash: localIdentHash,
  67. chunkGraph,
  68. module
  69. })
  70. .replace(/\[local\]/g, local)
  71. .replace(/\[uniqueName\]/g, /** @type {string} */ (uniqueName))
  72. .replace(/^((-?[0-9])|--)/, "_$1");
  73. };
  74. class CssLocalIdentifierDependency extends NullDependency {
  75. /**
  76. * @param {string} name name
  77. * @param {Range} range range
  78. * @param {string=} prefix prefix
  79. */
  80. constructor(name, range, prefix = "") {
  81. super();
  82. this.name = name;
  83. this.range = range;
  84. this.prefix = prefix;
  85. this._conventionNames = undefined;
  86. this._hashUpdate = undefined;
  87. }
  88. get type() {
  89. return "css local identifier";
  90. }
  91. /**
  92. * @param {string} name export name
  93. * @param {CssGeneratorExportsConvention} convention convention of the export name
  94. * @returns {string[]} convention results
  95. */
  96. getExportsConventionNames(name, convention) {
  97. if (this._conventionNames) {
  98. return this._conventionNames;
  99. }
  100. this._conventionNames = cssExportConvention(this.name, convention);
  101. return this._conventionNames;
  102. }
  103. /**
  104. * Returns the exported names
  105. * @param {ModuleGraph} moduleGraph module graph
  106. * @returns {ExportsSpec | undefined} export names
  107. */
  108. getExports(moduleGraph) {
  109. const module = /** @type {CssModule} */ (moduleGraph.getParentModule(this));
  110. const generator = /** @type {CssGenerator} */ (module.generator);
  111. const names = this.getExportsConventionNames(
  112. this.name,
  113. /** @type {CssGeneratorExportsConvention} */ (generator.convention)
  114. );
  115. return {
  116. exports: names.map(name => ({
  117. name,
  118. canMangle: true
  119. })),
  120. dependencies: undefined
  121. };
  122. }
  123. /**
  124. * Update the hash
  125. * @param {Hash} hash hash to be updated
  126. * @param {UpdateHashContext} context context
  127. * @returns {void}
  128. */
  129. updateHash(hash, { chunkGraph }) {
  130. if (this._hashUpdate === undefined) {
  131. const module =
  132. /** @type {CssModule} */
  133. (chunkGraph.moduleGraph.getParentModule(this));
  134. const generator = /** @type {CssGenerator} */ (module.generator);
  135. const names = this.getExportsConventionNames(
  136. this.name,
  137. /** @type {CssGeneratorExportsConvention} */
  138. (generator.convention)
  139. );
  140. this._hashUpdate = `exportsConvention|${JSON.stringify(names)}|localIdentName|${JSON.stringify(generator.localIdentName)}`;
  141. }
  142. hash.update(this._hashUpdate);
  143. }
  144. /**
  145. * @param {ObjectSerializerContext} context context
  146. */
  147. serialize(context) {
  148. const { write } = context;
  149. write(this.name);
  150. write(this.range);
  151. write(this.prefix);
  152. super.serialize(context);
  153. }
  154. /**
  155. * @param {ObjectDeserializerContext} context context
  156. */
  157. deserialize(context) {
  158. const { read } = context;
  159. this.name = read();
  160. this.range = read();
  161. this.prefix = read();
  162. super.deserialize(context);
  163. }
  164. }
  165. CssLocalIdentifierDependency.Template = class CssLocalIdentifierDependencyTemplate extends (
  166. NullDependency.Template
  167. ) {
  168. /**
  169. * @param {Dependency} dependency the dependency for which the template should be applied
  170. * @param {string} local local name
  171. * @param {DependencyTemplateContext} templateContext the context object
  172. * @returns {string} identifier
  173. */
  174. static getIdentifier(
  175. dependency,
  176. local,
  177. { module: m, chunkGraph, runtimeTemplate }
  178. ) {
  179. const dep = /** @type {CssLocalIdentifierDependency} */ (dependency);
  180. const module = /** @type {CssModule} */ (m);
  181. return (
  182. dep.prefix +
  183. getCssParser().escapeIdentifier(
  184. getLocalIdent(local, module, chunkGraph, runtimeTemplate)
  185. )
  186. );
  187. }
  188. /**
  189. * @param {Dependency} dependency the dependency for which the template should be applied
  190. * @param {ReplaceSource} source the current replace source which can be modified
  191. * @param {DependencyTemplateContext} templateContext the context object
  192. * @returns {void}
  193. */
  194. apply(dependency, source, templateContext) {
  195. const { module: m, moduleGraph, runtime, cssData } = templateContext;
  196. const dep = /** @type {CssLocalIdentifierDependency} */ (dependency);
  197. const module = /** @type {CssModule} */ (m);
  198. const generator = /** @type {CssGenerator} */ (module.generator);
  199. const names = dep.getExportsConventionNames(
  200. dep.name,
  201. /** @type {CssGeneratorExportsConvention} */
  202. (generator.convention)
  203. );
  204. const usedNames =
  205. /** @type {(string)[]} */
  206. (
  207. names
  208. .map(name =>
  209. moduleGraph.getExportInfo(module, name).getUsedName(name, runtime)
  210. )
  211. .filter(Boolean)
  212. );
  213. const local = usedNames.length === 0 ? names[0] : usedNames[0];
  214. const identifier = CssLocalIdentifierDependencyTemplate.getIdentifier(
  215. dep,
  216. local,
  217. templateContext
  218. );
  219. source.replace(dep.range[0], dep.range[1] - 1, identifier);
  220. for (const used of usedNames.concat(names)) {
  221. cssData.exports.set(used, getCssParser().unescapeIdentifier(identifier));
  222. }
  223. }
  224. };
  225. makeSerializable(
  226. CssLocalIdentifierDependency,
  227. "webpack/lib/dependencies/CssLocalIdentifierDependency"
  228. );
  229. module.exports = CssLocalIdentifierDependency;