ModuleChunkFormatPlugin.js 6.4 KB

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