EvalSourceMapDevToolPlugin.js 7.1 KB

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