EvalSourceMapDevToolPlugin.js 6.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206
  1. /*
  2. MIT License http://www.opensource.org/licenses/mit-license.php
  3. Author Tobias Koppers @sokra
  4. */
  5. "use strict";
  6. const { ConcatSource, RawSource } = require("webpack-sources");
  7. const ModuleFilenameHelpers = require("./ModuleFilenameHelpers");
  8. const NormalModule = require("./NormalModule");
  9. const RuntimeGlobals = require("./RuntimeGlobals");
  10. const SourceMapDevToolModuleOptionsPlugin = require("./SourceMapDevToolModuleOptionsPlugin");
  11. const JavascriptModulesPlugin = require("./javascript/JavascriptModulesPlugin");
  12. const ConcatenatedModule = require("./optimize/ConcatenatedModule");
  13. const { makePathsAbsolute } = require("./util/identifier");
  14. /** @typedef {import("webpack-sources").Source} Source */
  15. /** @typedef {import("../declarations/WebpackOptions").DevTool} DevToolOptions */
  16. /** @typedef {import("../declarations/plugins/SourceMapDevToolPlugin").SourceMapDevToolPluginOptions} SourceMapDevToolPluginOptions */
  17. /** @typedef {import("./Compiler")} Compiler */
  18. /** @type {WeakMap<Source, Source>} */
  19. const cache = new WeakMap();
  20. const devtoolWarning = new RawSource(`/*
  21. * ATTENTION: An "eval-source-map" devtool has been used.
  22. * This devtool is neither made for production nor for readable output files.
  23. * It uses "eval()" calls to create a separate source file with attached SourceMaps in the browser devtools.
  24. * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
  25. * or disable the default devtool with "devtool: false".
  26. * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
  27. */
  28. `);
  29. class EvalSourceMapDevToolPlugin {
  30. /**
  31. * @param {SourceMapDevToolPluginOptions|string} inputOptions Options object
  32. */
  33. constructor(inputOptions) {
  34. /** @type {SourceMapDevToolPluginOptions} */
  35. let options;
  36. if (typeof inputOptions === "string") {
  37. options = {
  38. append: inputOptions
  39. };
  40. } else {
  41. options = inputOptions;
  42. }
  43. this.sourceMapComment =
  44. options.append || "//# sourceURL=[module]\n//# sourceMappingURL=[url]";
  45. this.moduleFilenameTemplate =
  46. options.moduleFilenameTemplate ||
  47. "webpack://[namespace]/[resource-path]?[hash]";
  48. this.namespace = options.namespace || "";
  49. this.options = options;
  50. }
  51. /**
  52. * Apply the plugin
  53. * @param {Compiler} compiler the compiler instance
  54. * @returns {void}
  55. */
  56. apply(compiler) {
  57. const options = this.options;
  58. compiler.hooks.compilation.tap(
  59. "EvalSourceMapDevToolPlugin",
  60. compilation => {
  61. const hooks = JavascriptModulesPlugin.getCompilationHooks(compilation);
  62. new SourceMapDevToolModuleOptionsPlugin(options).apply(compilation);
  63. const matchModule = ModuleFilenameHelpers.matchObject.bind(
  64. ModuleFilenameHelpers,
  65. options
  66. );
  67. hooks.renderModuleContent.tap(
  68. "EvalSourceMapDevToolPlugin",
  69. (source, m, { runtimeTemplate, chunkGraph }) => {
  70. const cachedSource = cache.get(source);
  71. if (cachedSource !== undefined) {
  72. return cachedSource;
  73. }
  74. const result = r => {
  75. cache.set(source, r);
  76. return r;
  77. };
  78. if (m instanceof NormalModule) {
  79. const module = /** @type {NormalModule} */ (m);
  80. if (!matchModule(module.resource)) {
  81. return result(source);
  82. }
  83. } else if (m instanceof ConcatenatedModule) {
  84. const concatModule = /** @type {ConcatenatedModule} */ (m);
  85. if (concatModule.rootModule instanceof NormalModule) {
  86. const module = /** @type {NormalModule} */ (
  87. concatModule.rootModule
  88. );
  89. if (!matchModule(module.resource)) {
  90. return result(source);
  91. }
  92. } else {
  93. return result(source);
  94. }
  95. } else {
  96. return result(source);
  97. }
  98. /** @type {{ [key: string]: TODO; }} */
  99. let sourceMap;
  100. let content;
  101. if (source.sourceAndMap) {
  102. const sourceAndMap = source.sourceAndMap(options);
  103. sourceMap = sourceAndMap.map;
  104. content = sourceAndMap.source;
  105. } else {
  106. sourceMap = source.map(options);
  107. content = source.source();
  108. }
  109. if (!sourceMap) {
  110. return result(source);
  111. }
  112. // Clone (flat) the sourcemap to ensure that the mutations below do not persist.
  113. sourceMap = { ...sourceMap };
  114. const context = compiler.options.context;
  115. const root = compiler.root;
  116. const modules = sourceMap.sources.map(source => {
  117. if (!source.startsWith("webpack://")) return source;
  118. source = makePathsAbsolute(context, source.slice(10), root);
  119. const module = compilation.findModule(source);
  120. return module || source;
  121. });
  122. let moduleFilenames = modules.map(module => {
  123. return ModuleFilenameHelpers.createFilename(
  124. module,
  125. {
  126. moduleFilenameTemplate: this.moduleFilenameTemplate,
  127. namespace: this.namespace
  128. },
  129. {
  130. requestShortener: runtimeTemplate.requestShortener,
  131. chunkGraph,
  132. hashFunction: compilation.outputOptions.hashFunction
  133. }
  134. );
  135. });
  136. moduleFilenames = ModuleFilenameHelpers.replaceDuplicates(
  137. moduleFilenames,
  138. (filename, i, n) => {
  139. for (let j = 0; j < n; j++) filename += "*";
  140. return filename;
  141. }
  142. );
  143. sourceMap.sources = moduleFilenames;
  144. sourceMap.sourceRoot = options.sourceRoot || "";
  145. const moduleId = chunkGraph.getModuleId(m);
  146. sourceMap.file = `${moduleId}.js`;
  147. const footer =
  148. this.sourceMapComment.replace(
  149. /\[url\]/g,
  150. `data:application/json;charset=utf-8;base64,${Buffer.from(
  151. JSON.stringify(sourceMap),
  152. "utf8"
  153. ).toString("base64")}`
  154. ) + `\n//# sourceURL=webpack-internal:///${moduleId}\n`; // workaround for chrome bug
  155. return result(
  156. new RawSource(
  157. `eval(${
  158. compilation.outputOptions.trustedTypes
  159. ? `${RuntimeGlobals.createScript}(${JSON.stringify(
  160. content + footer
  161. )})`
  162. : JSON.stringify(content + footer)
  163. });`
  164. )
  165. );
  166. }
  167. );
  168. hooks.inlineInRuntimeBailout.tap(
  169. "EvalDevToolModulePlugin",
  170. () => "the eval-source-map devtool is used."
  171. );
  172. hooks.render.tap(
  173. "EvalSourceMapDevToolPlugin",
  174. source => new ConcatSource(devtoolWarning, source)
  175. );
  176. hooks.chunkHash.tap("EvalSourceMapDevToolPlugin", (chunk, hash) => {
  177. hash.update("EvalSourceMapDevToolPlugin");
  178. hash.update("2");
  179. });
  180. if (compilation.outputOptions.trustedTypes) {
  181. compilation.hooks.additionalModuleRuntimeRequirements.tap(
  182. "EvalSourceMapDevToolPlugin",
  183. (module, set, context) => {
  184. set.add(RuntimeGlobals.createScript);
  185. }
  186. );
  187. }
  188. }
  189. );
  190. }
  191. }
  192. module.exports = EvalSourceMapDevToolPlugin;