ModuleChunkFormatPlugin.js 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202
  1. /*
  2. MIT License http://www.opensource.org/licenses/mit-license.php
  3. Author Tobias Koppers @sokra
  4. */
  5. "use strict";
  6. const { ConcatSource } = require("webpack-sources");
  7. const { RuntimeGlobals } = require("..");
  8. const HotUpdateChunk = require("../HotUpdateChunk");
  9. const Template = require("../Template");
  10. const { getAllChunks } = require("../javascript/ChunkHelpers");
  11. const {
  12. getCompilationHooks,
  13. getChunkFilenameTemplate
  14. } = require("../javascript/JavascriptModulesPlugin");
  15. const { updateHashForEntryStartup } = require("../javascript/StartupHelpers");
  16. /** @typedef {import("../Compiler")} Compiler */
  17. class ModuleChunkFormatPlugin {
  18. /**
  19. * Apply the plugin
  20. * @param {Compiler} compiler the compiler instance
  21. * @returns {void}
  22. */
  23. apply(compiler) {
  24. compiler.hooks.thisCompilation.tap(
  25. "ModuleChunkFormatPlugin",
  26. compilation => {
  27. compilation.hooks.additionalChunkRuntimeRequirements.tap(
  28. "ModuleChunkFormatPlugin",
  29. (chunk, set) => {
  30. if (chunk.hasRuntime()) return;
  31. if (compilation.chunkGraph.getNumberOfEntryModules(chunk) > 0) {
  32. set.add(RuntimeGlobals.require);
  33. set.add(RuntimeGlobals.startupEntrypoint);
  34. set.add(RuntimeGlobals.externalInstallChunk);
  35. }
  36. }
  37. );
  38. const hooks = getCompilationHooks(compilation);
  39. hooks.renderChunk.tap(
  40. "ModuleChunkFormatPlugin",
  41. (modules, renderContext) => {
  42. const { chunk, chunkGraph, runtimeTemplate } = renderContext;
  43. const hotUpdateChunk =
  44. chunk instanceof HotUpdateChunk ? chunk : null;
  45. const source = new ConcatSource();
  46. if (hotUpdateChunk) {
  47. throw new Error(
  48. "HMR is not implemented for module chunk format yet"
  49. );
  50. } else {
  51. source.add(`export const id = ${JSON.stringify(chunk.id)};\n`);
  52. source.add(`export const ids = ${JSON.stringify(chunk.ids)};\n`);
  53. source.add(`export const modules = `);
  54. source.add(modules);
  55. source.add(`;\n`);
  56. const runtimeModules =
  57. chunkGraph.getChunkRuntimeModulesInOrder(chunk);
  58. if (runtimeModules.length > 0) {
  59. source.add("export const runtime =\n");
  60. source.add(
  61. Template.renderChunkRuntimeModules(
  62. runtimeModules,
  63. renderContext
  64. )
  65. );
  66. }
  67. const entries = Array.from(
  68. chunkGraph.getChunkEntryModulesWithChunkGroupIterable(chunk)
  69. );
  70. if (entries.length > 0) {
  71. const runtimeChunk = entries[0][1].getRuntimeChunk();
  72. const currentOutputName = compilation
  73. .getPath(
  74. getChunkFilenameTemplate(chunk, compilation.outputOptions),
  75. {
  76. chunk,
  77. contentHashType: "javascript"
  78. }
  79. )
  80. .split("/");
  81. // remove filename, we only need the directory
  82. currentOutputName.pop();
  83. const getRelativePath = chunk => {
  84. const baseOutputName = currentOutputName.slice();
  85. const chunkOutputName = compilation
  86. .getPath(
  87. getChunkFilenameTemplate(
  88. chunk,
  89. compilation.outputOptions
  90. ),
  91. {
  92. chunk: chunk,
  93. contentHashType: "javascript"
  94. }
  95. )
  96. .split("/");
  97. // remove common parts
  98. while (
  99. baseOutputName.length > 0 &&
  100. chunkOutputName.length > 0 &&
  101. baseOutputName[0] === chunkOutputName[0]
  102. ) {
  103. baseOutputName.shift();
  104. chunkOutputName.shift();
  105. }
  106. // create final path
  107. return (
  108. (baseOutputName.length > 0
  109. ? "../".repeat(baseOutputName.length)
  110. : "./") + chunkOutputName.join("/")
  111. );
  112. };
  113. const entrySource = new ConcatSource();
  114. entrySource.add(source);
  115. entrySource.add(";\n\n// load runtime\n");
  116. entrySource.add(
  117. `import __webpack_require__ from ${JSON.stringify(
  118. getRelativePath(runtimeChunk)
  119. )};\n`
  120. );
  121. const startupSource = new ConcatSource();
  122. startupSource.add(
  123. `var __webpack_exec__ = ${runtimeTemplate.returningFunction(
  124. `__webpack_require__(${RuntimeGlobals.entryModuleId} = moduleId)`,
  125. "moduleId"
  126. )}\n`
  127. );
  128. const loadedChunks = new Set();
  129. let index = 0;
  130. for (let i = 0; i < entries.length; i++) {
  131. const [module, entrypoint] = entries[i];
  132. const final = i + 1 === entries.length;
  133. const moduleId = chunkGraph.getModuleId(module);
  134. const chunks = getAllChunks(
  135. entrypoint,
  136. runtimeChunk,
  137. undefined
  138. );
  139. for (const chunk of chunks) {
  140. if (loadedChunks.has(chunk)) continue;
  141. loadedChunks.add(chunk);
  142. startupSource.add(
  143. `import * as __webpack_chunk_${index}__ from ${JSON.stringify(
  144. getRelativePath(chunk)
  145. )};\n`
  146. );
  147. startupSource.add(
  148. `${RuntimeGlobals.externalInstallChunk}(__webpack_chunk_${index}__);\n`
  149. );
  150. index++;
  151. }
  152. startupSource.add(
  153. `${
  154. final ? "var __webpack_exports__ = " : ""
  155. }__webpack_exec__(${JSON.stringify(moduleId)});\n`
  156. );
  157. }
  158. entrySource.add(
  159. hooks.renderStartup.call(
  160. startupSource,
  161. entries[entries.length - 1][0],
  162. {
  163. ...renderContext,
  164. inlined: false
  165. }
  166. )
  167. );
  168. return entrySource;
  169. }
  170. }
  171. return source;
  172. }
  173. );
  174. hooks.chunkHash.tap(
  175. "ModuleChunkFormatPlugin",
  176. (chunk, hash, { chunkGraph, runtimeTemplate }) => {
  177. if (chunk.hasRuntime()) return;
  178. hash.update("ModuleChunkFormatPlugin");
  179. hash.update("1");
  180. const entries = Array.from(
  181. chunkGraph.getChunkEntryModulesWithChunkGroupIterable(chunk)
  182. );
  183. updateHashForEntryStartup(hash, chunkGraph, entries, chunk);
  184. }
  185. );
  186. }
  187. );
  188. }
  189. }
  190. module.exports = ModuleChunkFormatPlugin;